Meal Maker - push undefined

Get Help JavaScript
#1

Hello everyone,

I’m encountering an issue with the meal meaker, here’s my code :

const menu = {
  _courses: {
    appetizers: [],
    mains: [],
    desserts: [],
  },
  get appetizers(){
    return this._courses.appetizers
  },
  set appetizers(appetizers){
    this._courses.appetizers = appetizers;
  },
  get mains(){
    return this._courses.mains
  },
  set mains(mains){
    this._courses.mains = mains;
  },
  get desserts(){
    return this._courses.desserts
  },
  set desserts(desserts){
    this._courses.desserts = desserts;
  },

  get courses() {
    return {
      appetizers: this.appetizers,
      mains: this.mains,
      desserts: this.desserts
    }
  },

  addDishToCourse(courseName, dishName, dishPrice){
    const dish = {
      name: dishName,
      price: dishPrice
    };
   return this._courses[courseName].push(dish);
  },

  getRandomDishFromCourse(courseName){
    const dishes 
    = this._courses[courseName];
  const randomIndex = Math.floor(Math.random()* dishes.length);
  return dishes[randomIndex];
  },

  generateRandomMeal() {
    const appetizer = this.getRandomDishFromCourse('appetizers');
  const main = this.getRandomDishFromCourse('mains');
  const dessert = this.getRandomDishFromCourse('desserts');
  const totalPrice = appetizer.price + main.price + dessert.price;

  return `Your meal is ${appetizer.name}, ${main.name}, ${dessert.name}. The price is ${totalPrice}.`;
  },

};

 menu.addDishToCourse('appetizers', 'Mozarella', 3.70);
  menu.addDishToCourse('appetizers', 'Ceasar Salad', 4.25);
  menu.addDishToCourse('appetizers', 'Soup', 7.00);
  menu.addDishToCourse('Mains', 'Fried Rice', 10.20);
  menu.addDishToCourse('Mains', 'Mie Goreng', 12.15);
  menu.addDishToCourse('Mains', 'Pepes Ikan', 21.20);
  menu.addDishToCourse('desserts', 'Chocolate cake', 7.50);
  menu.addDishToCourse('desserts', 'Crème brulée', 7.60);
  menu.addDishToCourse('desserts', 'Fruits', 14.20);

const meal = menu.generateRandomMeal();
console.log(meal)

So until I add the dishes to the course at the very end, everything’s fine. But after that, I get an error, that the .push() line 39 is not defined …

I really don’t get how it ‘becomes’ undefined at the very last step ?

If anybody can help, I’ll be very grateful :slight_smile:

Thanks a lot !

#2

Hi @script7711596941
that error message means that the array to be pushed to cannot be found.

So add a console to the addDishToCourse method that logs the argument you receive: courseName and compare it with the key of the array you want to push the dish to: Object.keys(this._courses).

#3

Thanks for your help,

Well now that I add a console to the method addDishToCourse, no more error, but nothing logs either… Confuses me even more !

#4

Did you add the console after the return statement? Code below that will not be executed.
If you add it like this, you should get a result:

addDishToCourse(courseName, dishName, dishPrice){
    const dish = {
      name: dishName,
      price: dishPrice
    };
    console.log(courseName, Object.keys(this._courses));
   return this._courses[courseName].push(dish);
  },

But since you push you don’t need the return keyword anyway.

#5

Indeed I get a result, but a weird one, and I still have an error message :

appetizers [ 'appetizers', 'mains', 'desserts' ]
Mains [ 'appetizers', 'mains', 'desserts' ]
/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:40
   return this._courses[courseName].push(dish);
                                   ^

TypeError: Cannot read property 'push' of undefined

And I don’t understand that it’s a TypeError, I don’t believe there are any typos there :thinking:

#6

Yes, you still have an error message, because you did not eliminate the error yet, you just logged it.

There it is. Javascript is case-sensitive. So ‘Mains’ and ‘mains’ is not the same.

#7

aaah
Gosh, sorry, I guess not coding for a few weeks gets you out of practice quickly.

But thanks a lot, I’ll keep that object.keys in mind for later. I guess I was looking too much into the method & push, and not in the last step.

#8

I have one last question though, how come the error shows line 40, so with the push, I think that’s what made me look the wrong way, when the error is actually line 65 or so here ?

#9

Line 65 is where you call the method, right? The method call does not validate your arguments. The method itself also doesn’t care what it receives until it doesn’t find the variable/key it is supposed to use for whatever purpose. And that is the case when you try to push the dish to an undefined array.

#10

Ah alright, I think I get it.

Thank you for taking the time to explain !

1 Like
#11

Hey im also having a problem on this project. This is my code,

const menu = {
_courses : {
_appetizers: ,
_mains: ,
_desserts: ,
},
get appetizers() {
return this._courses._appetizers
},
get mains() {
return this._courses._mains;
},
get desserts() {
return this._courses._desserts
},
set appetizers(appetizers) {
this._courses._appetizers = appetizers;
},
set mains(mains) {
this._courses._mains = mains;
},
set desserts(desserts) {
this._courses._desserts = desserts;
},

get courses() {
return {
appetizers: this.appetizers,
mains: this.mains,
desserts: this.desserts,
}
},
// …
addDishtoCourse(courseName, dishName, dishPrice) {
const dish = {
name: dishName,
price: dishPrice,
}
return this.courses[courseName].push(dish)
},
getRandomDishFromCourse(courseName) {
const dishes = this.courses[courseName];
const randomIndex = Math.floor(Math.random() * dishes.length)
return dishes[randomIndex];
},
generateRandomMeal() {
const appetizer = this.getRandomDishFromCourse(‘appetizers’);
const main = this.getRandomDishFromCourse(‘mains’);
const dessert = this.getRandomDishFromCourse(‘deserts’)
const totalPrice = appetizer.price + mains.price + desserts.price;
return Your meal is ${appetizer.name}, ${main.name}, and ${desserts.name}, The price is ${totalPrice}.
}
};

menu.addDishtoCourse(‘appetizers’, ‘salad’, 4.00)
menu.addDishtoCourse(‘appetizers’, ‘wings’, 6.00)
menu.addDishtoCourse(‘appetizers’, ‘salad’, 5.00)

menu.addDishtoCourse(‘mains’, ‘steak’, 16.25)
menu.addDishtoCourse(‘mains’, ‘salmon’, 18.00)
menu.addDishtoCourse(‘mains’, ‘tofu’, 12.20)

menu.addDishtoCourse(‘desserts’, ‘ice cream’, 2.50)
menu.addDishtoCourse(‘desserts’, ‘brownie’, 3.50)
menu.addDishtoCourse(‘desserts’, ‘cookies’, 2.50)

const meal = menu.generateRandomMeal();
console.log(meal);

This is the error,
TypeError: Cannot read property ‘length’ of undefined
at Object.getRandomDishFromCourse (/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:43:56)
at Object.generateRandomMeal (/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:47:26)
at Object. (/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:67:19)
at Module._compile (module.js:571:32)
at Object.Module._extensions…js (module.js:580:10)
at Module.load (module.js:488:32)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.runMain (module.js:605:10)
at run (bootstrap_node.js:427:7)

#12

If the solution in this thread doesn’t work for you, open a new topic please. Also, please read this article about formatting code in posts. That makes reading your code easier and increases your chances of getting help.