JavaScript Syntax III: Why is my code throwing undefined on the ratings? - javascript

so I am currently working on a project on Code Academy, I am not certain why is it showing undefined. Although I've watched the walk through video, the project is named Build a Library. Here's my entire code:
I am still confused regarding JavaScrip, so please bear with me. Thank you for those who will answer!
class Media {
constructor(title) {
this._title = title;
this._ratings = [];
this._isCheckedOut = false;
}
get title() {
return this._title;
}
get isCheckedOut() {
return this._isCheckedOut;
}
get ratings() {
return this._ratings;
}
set isCheckedOut(value) {
this._isCheckedOut = value;
}
toggleCheckOutStatus() {
this._isCheckedOut = !this._isCheckedOut;
}
getAverageRating() {
let ratingsSum = this.ratings.reduce((accumulator, rating) => accumulator + rating);
}
addRating(value) {
this.ratings.push(value);
}
}
class Book extends Media {
constructor(author, title, pages) {
super(title);
this._author = author;
this._pages = pages;
}
get author() {
return this._author;
}
get pages() {
return this._pages;
}
}
class Movie extends Media {
constructor(director, title, runTime) {
super(title);
this._director = director;
this._runTime = runTime;
}
get director() {
return this._director;
}
get runTime() {
return this._runTime;
}
}
const historyOfEverything = new Book("Bill Bryson", "A Short History of Nearly Everything", 544);
historyOfEverything.toggleCheckOutStatus();
console.log(historyOfEverything.isCheckedOut);
historyOfEverything.addRating(4);
historyOfEverything.addRating(5);
historyOfEverything.addRating(5);
console.log(historyOfEverything.getAverageRating());
const speed = new Movie("Jan de Bont", "Speed", 116);
speed.toggleCheckOutStatus();
console.log(speed.isCheckedOut);
speed.addRating(1);
speed.addRating(1);
speed.addRating(5);
console.log(speed.getAverageRating());

because you are not returning anything from the getAverageRating function,
you should add : return ratingsSum/this.ratings.length if i understood what you want to do , so the whole function will be something like this:
getAverageRating() {
let ratingsSum = this.ratings.reduce(
(accumulator, rating) => accumulator + rating
);
return ratingsSum/this.ratings.length
}

Related

How to override a owl function in odoo?

I want to override a function in companyService but have no idea how to do it.
Here is the code in company_service.js and I want to override the start function.
/** #odoo-module **/
import { browser } from "#web/core/browser/browser";
import { registry } from "#web/core/registry";
import { symmetricalDifference } from "#web/core/utils/arrays";
import { session } from "#web/session";
function parseCompanyIds(cidsFromHash) {
const cids = [];
if (typeof cidsFromHash === "string") {
cids.push(...cidsFromHash.split(",").map(Number));
} else if (typeof cidsFromHash === "number") {
cids.push(cidsFromHash);
}
return cids;
}
function computeAllowedCompanyIds(cids) {
const { user_companies } = session;
let allowedCompanyIds = cids || [];
const availableCompaniesFromSession = user_companies.allowed_companies;
const notReallyAllowedCompanies = allowedCompanyIds.filter(
(id) => !(id in availableCompaniesFromSession)
);
if (!allowedCompanyIds.length || notReallyAllowedCompanies.length) {
allowedCompanyIds = [user_companies.current_company];
}
return allowedCompanyIds;
}
export const companyService = {
dependencies: ["user", "router", "cookie"],
start(env, { user, router, cookie }) {
let cids;
if ("cids" in router.current.hash) {
cids = parseCompanyIds(router.current.hash.cids);
} else if ("cids" in cookie.current) {
cids = parseCompanyIds(cookie.current.cids);
}
let allowedCompanyIds = Object.values(session.user_companies.allowed_companies).map(company => company.id);
const stringCIds = allowedCompanyIds.join(",");
router.replaceState({ cids: stringCIds }, { lock: true });
cookie.setCookie("cids", stringCIds);
user.updateContext({ allowed_company_ids: allowedCompanyIds });
const availableCompanies = session.user_companies.allowed_companies;
return {
availableCompanies,
get allowedCompanyIds() {
return allowedCompanyIds.slice();
},
get currentCompany() {
return availableCompanies[allowedCompanyIds[0]];
},
setCompanies(mode, ...companyIds) {
// compute next company ids
let nextCompanyIds;
if (mode === "toggle") {
nextCompanyIds = symmetricalDifference(allowedCompanyIds, companyIds);
} else if (mode === "loginto") {
const companyId = companyIds[0];
if (allowedCompanyIds.length === 1) {
// 1 enabled company: stay in single company mode
nextCompanyIds = [companyId];
} else {
// multi company mode
nextCompanyIds = [
companyId,
...allowedCompanyIds.filter((id) => id !== companyId),
];
}
}
nextCompanyIds = nextCompanyIds.length ? nextCompanyIds : [companyIds[0]];
// apply them
router.pushState({ cids: nextCompanyIds }, { lock: true });
cookie.setCookie("cids", nextCompanyIds);
browser.setTimeout(() => browser.location.reload()); // history.pushState is a little async
},
};
},
};
registry.category("services").remove("company").add("company", companyService);
You can use the patch utility
However, there are situations for which it is not sufficient. In those cases, we may need to modify an object or a class in place. To achieve that, Odoo provides the utility function patch. It is mostly useful to override/update the behavior of some other component/piece of code that one does not control.
Example:
/** #odoo-module **/
import { patch } from "#web/core/utils/patch";
import { companyService } from "#web/webclient/company_service";
patch(companyService, 'module_name.companyService', {
start(env, { user, router, cookie }) {
return this._super(env, { user, router, cookie });
}
});

Why can't I refactor those accumulating ifs by using a jump table?

I try to do a minor refactoring, but it breaks all tests.
I have a lot of ifs that I'd like to get rid off by using a jump table.
I want to go from here :
export class Pharmacy {
constructor(drugs = []) {
this.drugs = drugs
}
updatePharmacyBenefits() {
this.drugs.forEach((drug) => {
if (drug.name !== 'Magic Pill')
drug.setBenefitStrategy(new MagicPillStrategy())
if (drug.name === 'Herbal Tea')
drug.setBenefitStrategy(new HerbalTeaStrategy())
if (drug.name === 'Fervex')
drug.setBenefitStrategy(new FervexStrategy())
if (drug.name === 'Dafalgan')
drug.setBenefitStrategy(new DafalganStrategy())
drug.updateBenefit()
drug.updateExpiration()
})
return this.drugs
}
}
to here :
export class Pharmacy {
constructor(drugs = []) {
this.drugs = drugs
}
updatePharmacyBenefits() {
const drugStrategies = {
'Herbal Tea': new HerbalTeaStrategy(),
'Magic Pill': new MagicPillStrategy(),
Fervex: new FervexStrategy(),
Dafalgan: new DafalganStrategy(),
}
const specialsDrugs = ['Herbal Tea', 'Fervex', 'Magic Pill', 'Dafalgan']
this.drugs.forEach((drug) => {
if (drug.name.includes(specialsDrugs))
drug.setBenefitStrategy(drugStrategies[drug.name])
drug.updateBenefit()
drug.updateExpiration()
})
return this.drugs
}
}
I have no meaningful errors messages, I can just observe all my tests failing has if nothing has happened.

Dynamically building a complex object

This will be the different for every user based on their roles. I am looking to build an object that can look like this:
let permissions = {
'state': {
'tool': ['subTool1', 'subTool2']
}
}
An example:
roles = ['NY_email_submit', 'NY_email_approve', 'NY_build_submit', 'NY_build_view', 'DC_email_submit']
let permissions = {
'NY': {
'email': ['submit', 'approve'],
'build': ['submit', 'view']
},
'DC': {
'email': ['submit']
}
};
I am looping through a list, named roles, passed in that contains strings broken up like state_tool_subTool.
I would like it to have no duplicates. For example, if the next user role ran through the loop with the object above is NY_build_approve, I would like to simply add approve to the the list at ['build'].
Currently I have this that is not working correctly.
roles.forEach(role => {
role = role.split('_');
let state = role[0];
let tool = role[1];
let subTool = role[2];
if ([state] in permissions) {
permissions[state] = { [`${tool}`]: [subTool] };
} else {
//permissions[state][`${tool}`].push(subTool);
}
});
This should do the trick! You were on the right track, just needed another layer of checks
let permissions = {};
roles = ['NY_email_submit','NY_email_approve','NY_build_submit','NY_build_view', 'DC_email_submit'];
roles.forEach(role => {
let [state, tool, subTool] = role.split('_');
if (state in permissions) {
if (tool in permissions[state]) {
permissions[state][tool].push(subTool)
} else {
permissions[state][tool] = [subTool]
}
} else {
permissions[state] = {[tool]: [subTool]}
}
});
console.log(permissions);
roles = ['NY_email_submit', 'NY_email_approve', 'NY_build_submit', 'NY_build_view', 'DC_email_submit']
let permissions = {};
roles.forEach(role => {
role = role.split('_');
let state = role[0];
let tool = role[1];
let subTool = role[2];
if (!permissions[state]) {
permissions[state] = {[tool] : [subTool]};
} else {
if (permissions[state][tool]) {
if(!permissions[state][tool].includes(subTool)) {
permissions[state][tool] = [...permissions[state][tool], subTool];
}
}
else {
permissions[state][tool] = [subTool];
}
}
});
console.log(permissions);
here is another approach using reduce
roles = ['NY_email_submit', 'NY_email_approve', 'NY_build_submit', 'NY_build_view', 'DC_email_submit']
sp=roles.map(o=>o.split("_")).reduce((acc,curr)=>{
if (!acc[curr[0]]) acc[curr[0]]={...acc[curr[0]],[curr[1]]:[...[curr[2]]]}
else {
if(acc[curr[0]][curr[1]]) {
i=acc[curr[0]][curr[1]]
acc[curr[0]]={...acc[curr[0]],[curr[1]]:[...i,...[curr[2]]]} }
else {acc[curr[0]]={...acc[curr[0]],[curr[1]]:[...[curr[2]]]} }
}
return acc
},{})
console.log(sp)

Creating new array vs modifing the same array in react

Following is the piece of code which is working fine, but I have one doubt regarding - const _detail = detail; code inside a map method. Here you can see that I am iterating over an array and modifying the object and then setting it to setState().
Code Block -
checkInvoiceData = (isUploaded, data) => {
if (isUploaded) {
const { invoiceData } = this.state;
invoiceData.map(invoiceItem => {
if (invoiceItem.number === data.savedNumber) {
invoiceItem.details.map(detail => {
const _detail = detail;
if (_detail.tagNumber === data.tagNumber) {
_detail.id = data.id;
}
return _detail;
});
}
return invoiceItem;
});
state.invoiceData = invoiceData;
}
this.setState(state);
};
Is this approach ok in React world or I should do something like -
const modifiedInvoiceData = invoiceData.map(invoiceItem => {
......
code
......
})
this.setState({invoiceData: modifiedInvoiceData});
What is the pros and cons of each and which scenario do I need to keep in mind while taking either of one approach ?
You cannot mutate state, instead you can do something like this:
checkInvoiceData = (isUploaded, data) => {
if (isUploaded) {
this.setState({
invoiceData: this.state.invoiceData.map(
(invoiceItem) => {
if (invoiceItem.number === data.savedNumber) {
invoiceItem.details.map(
(detail) =>
detail.tagNumber === data.tagNumber
? { ...detail, id: data.id } //copy detail and set id on copy
: detail //no change, return detail
);
}
return invoiceItem;
}
),
});
}
};
Perhaps try something like this:
checkInvoiceData = (isUploaded, data) => {
// Return early
if (!isUploaded) return
const { invoiceData } = this.state;
const updatedInvoices = invoiceData.map(invoiceItem => {
if (invoiceItem.number !== data.savedNumber) return invoiceItem
const details = invoiceItem.details.map(detail => {
if (detail.tagNumber !== data.tagNumber) return detail
return { ...detail, id: data.id };
});
return { ...invoiceItem, details };
});
this.setState({ invoiceData: updatedInvoices });
};
First, I would suggest returning early rather than nesting conditionals.
Second, make sure you're not mutating state directly (eg no this.state = state).
Third, pass the part of state you want to mutate, not the whole state object, to setState.
Fourth, return a new instance of the object so the object reference updates so React can detect the change of values.
I'm not saying this is the best way to do what you want, but it should point you in a better direction.

How can i assign nested data to a new variable?

I want to create a new variable line and make it contain nested data.
What I am expecting as result:
{
description: "descriptionString",
vatInfo : {
vatAccount: {
vatCode : "vatCode"
}
}
}
How I am doing it:
export function changeProductOnLine(originalLine, product, customer, invoice) {
let line = { ...originalLine, product }
if (product) {
const vatCode = getProductVatCode(line, invoice)
line.description = buildLineDescription(product.name, product.description)
line.vatInfo.vatAccount.vatCode = "v10"
return line
}
Is it correct what I am doing ? Can it work ?
What you're doing is close, but you need to keep in mind that when you use a spreader like that, what you'll end up with is this:
{
description: "descriptionString",
vatInfo : {
vatAccount: {
vatCode : "vatCode"
}
},
product: {
description: "descriptionString",
vatInfo : {
vatAccount: {
vatCode : "vatCode"
}
}
}
}
What I think you want is for product to overwrite the values, but not end up with a 'product' property in your object, based on what you explained you wanted. Try this:
export function changeProductOnLine(originalLine, product, customer, invoice) {
if (product) {
return {
...originalLine,
// since these are the last thing in the new obj it will overwrite anything in the obj
description: buildLineDescription(product.name, product.description),
vatInfo: {
vatAccount : {
vatCode: getProductVatCode(line, invoice)
}
}
}
} else {
return line
}
}
This way, you also don't end up creating a new variable in memory just to modify it slightly then return it. It all happens at once, and ONLY if you have a arg 'product' value other than undefined or null

Categories

Resources