Meal Maker Madness

Language Help JavaScript
1

Hi Js.Ninjas !

I somehow I keep getting an error in my meal maker and i have no idea why?

let menu = {
  _courses: {
    appetizers: [],
    mains: [],
    desserts: [],
  },
  
  get appetizers () {
    return this._courses.appetizers;
  },
  
  get mains () {
    return this._courses.mains;
  },
  
  get dessert() {
    return this._courses.desserts;
  },
  
  set appetizers (appetizers) {
    return this._courses.appetizers = appetizers;
  },
  
  set mains (mains) {
    return this._courses.mains = mains;
  },
  
  set desserts (desserts) {
    return this._courses.desserts = desserts;
  },
  
  get courses () {
    return {
      appetizers:this.appetizers,
      mains:this.mains,
      desserts:this.desserts,
    }
  },
  
  addDishToCourse(courseName,dishName,dishPrice) {
    let dish = {
      name:dishName,
      price:dishPrice,
    }
    return this.courses[courseName].push(dish);
  },
  
  getRandomDishFromCourse(courseName) {
    var dishes = this._courses[courseName];
    var randomIndex = Math.floor(Math.random() *dishes.length);
    return dishes[randomIndex];
  },
  
  generateRandomMeal() {
    let appetizer = this.getRandomDishFromCourse('appetizers');
    let main = this.getRandomDishFromCourse('mains');
    let 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.generateRandomMeal('Appetizer', 'Olives', 2.99 );
menu.generateRandomMeal('Appetizer', 'Coffee', 1.99 );
menu.generateRandomMeal('Appetizer', 'Nuts', 1.99 );

Perhaps someone can shed some light?

Luv
A.

1 Like
2

The first thing I notice is that you have not defined the get courses correctly.

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

Should be:

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

Also you call generateRandomMeal with ‘Appetizer’ as an input value.

menu.generateRandomMeal('Appetizer', 'Olives', 2.99 );

This is a string with capital A whilst your _courses keys are written in lowercaps ‘appetizers’.
This is very important because generateRandomMeal calls the addDishToCourse function as follows:

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

If your courseName is different from the _courses keys it won’t work.

2 Likes
3

Ow and a detail I just noticed… :stuck_out_tongue:

You use generateRandomMeal function to add dishes whilst you should use the
menu.addDishToCourse function to add dishes.

menu.generateRandomMeal('Appetizer', 'Olives', 2.99 );

// should be

menu.addDishToCourse('appetizers', 'Olives', 2.99);  // etc..
2 Likes
4

Hi Jannes,

Oh…now it all makes sense.
Thank you so much for taking the time.

Cheers!
A.

2 Likes
6

Hi all ,
I keep an error

const menu = {
_courses:{
appetizers :,
mains :,
dessserts :,
get appetizers()
{
// return this.appetizers;
},

set appetizers(appetizerIn)
{
  this.appetizers.push(appetizerIn); 
},

get mains()
{
  return this.mains;
}, 

set mains(main)
{
  this.mains.push(main);
}, 

get desserts()
{
  return this.desserts;
},

set desserts(dessert)
{
  this.desserts.push(dessert);
},

},

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

addDishToCourse(courseName, dishName, dishPrice)
{
const dish = {
name : dishName,
price : dishPrice
};

this._courses[courseName].push(dish);

},

getRandomDishFromCourse(courseName)
{
const dishes = this._courses[courseName];
let index = Math.floor(Math.random() * dishes.length);

return dishes[index];

},

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}, ${desserts.name}. The total price is = R ${totalPrice}`;

}

};

menu.addDishToCourse(‘appetizers’, ‘Juicy Prawns’, 35);

7

Please describe the error by posting the error message. It will include traceback information such as line number, or statement that throws the error.

8

home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:53
this._courses[courseName].push(dish);

^

TypeError: Cannot read property ‘push’ of undefined

at Object.addDishToCourse (/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:53:30)

at Object. (/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:77:6)

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)

at startup (bootstrap_node.js:151:9)

9

I am confused about your setters. Could the error eventually lead to those being wrong? @mtf
@nkavelomasiya0342543 uses push in its setters. Whilst I use declarations.

Also, he has commented out the appetizers getter.

These are mine:

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

Oh okay I see. Let me work on that. Thank you for the clarification.

11

My modified code below but I still get the same error “Cannot read property ‘push’ of undefined”. This is for the "addDishToCourse

const menu = {

_courses:{

appetizers:,

mains:,

dessserts:,

},

get appetizers()

{

return this._courses.appetizers;

},

set appetizers(appetizerIn)

{

this._courses.appetizers = appetizerIn;

},

get mains()

{

return this._courses.mains;

},

set mains(mainIn)

{

this._courses.mains = mainIn;

},

get desserts()

{

return this._courses.desserts;

},

set desserts(dessertIn)

{

this._courses.desserts = dessert;

},

get courses()

{

return {

appetizer: this.appetizers,

mains: this.mains,

desserts: this.desserts

};

},

addDishToCourse(coursesName, dishName, dishPrice)

{

const dish = {

name : dishName,

price : dishPrice

}

this._courses[coursesName].push(dish);

},

getRandomDishFromCourse(courseName)

{

const dishes = this._courses[courseName];

const index = Math.floor(Math.random() * dishes.length);

return dishes[index];

},

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](http://appetizer.name)}, ${[main.name](http://main.name)}, ${[desserts.name](http://desserts.name)}. The total price is = R ${totalPrice};

}

};

menu.addDishToCourse(‘appetizers’, ‘Juicy Prawns’, 35);

menu.addDishToCourse(‘appetizers’, ‘Soup’, 5);

menu.addDishToCourse(‘appetizers’, ‘Sliced Pineapple’, 10);

menu.addDishToCourse(‘mains’, ‘Steak’, 75);

menu.addDishToCourse(‘mains’, ‘Ribs’, 85);

menu.addDishToCourse(‘mains’, ‘Double cheese burger’, 60);

menu.addDishToCourse(‘desserts’, ‘Chocolate brownies’, 45);

menu.addDishToCourse(‘desserts’, ‘Fruit Salad’, 20);

menu.addDishToCourse(‘desserts’, ‘Carrot Cake’, 15);

12

I spot the error after running your code and calling some console.log of variables.
The error is kind of stupid actually :P.

It is giving a undefined only when using addDishToCourse to add a dessert.
I then noticed that your _course object has a typo :smiley: .

See if you can spot it now :wink: .

_courses: {
   appetizers: [],
   mains: [],
   dessserts: [],
},

PS: I somehow have the feeling you are from South Africa, how can I tell?

13

Your setters are no doubt not being deployed. The addDishToCourse method is doing the pushing directly to the properties. If we look at the setters, they actually overwrite the arrays in each course.

To be able to deploy the setters, we would need to make a direct assignment in the addDish… method.

this._courses[courseName] = dish

and then push to the array in the setter.

14

OMG!!! How didn’t I miss that. My desserts property had an extra ‘s’. I’ve been stuck for days. Thank you very much.

Oh by the way you are right, I am from South Africa. I’m just curious about what got you thinking.

15

Linguistics.

Whether Canadian or Dutch the reader picks up on it.

16

You are very welcome :smiley: .

The clue is in here :wink: .

return `Your meal is ${appetizer.name}, ${main.name}, ${desserts.name}. The total price is  R ${totalPrice}`;
17

@nkavelomasiya0342543 is neither, but I would say he merely forgot to type “getting” after “keep” :wink: .

Also I wouldn’t think “I keep is” a mistake commonly made by the Dutch since I am one myself.

Does that mean the setters are actually disposable in this case and are merely there for show?

1 Like
18

It would appear so. All we really need is the getters if the pushing is done in the addDish… method.

I missed that R. Obviously a better clue.

1 Like