Meal Maker Error?


#1

ERROR :

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

TypeError: Cannot read property 'push' of undefined

Link To Meal Maker

CODE:

let menu = {
	_courses: {
    appetizers: [],
    
    get appetizers() {
      
    },
    
    set appetizers(appetizersIn) {
      
    },
    mains: [],
    
    get mains() {
      
    },
    
    set mains(mainsIn) {
      
    },
    
    
    desserts: [],
    
    get desserts() {
      
    },
    
    set desserts(dessertsIn) {
      
    }
    
    
  },
  
  get courses() {
    return {
			appetizers :
      	this._courses.appetizers,
   		mains :
      	this._courses.mains,
      desserts :
				this.courses.desserts
    }
  },
  addDishToCourse (courseName,dishName,dishPrice) {
    const dish = {
     name : dishName,
     price : dishPrice
    };

  this._courses[courseName].push(dish);
  },
  
  getRandomDishFromCourses(courseName) {
    const dishes = this._courses[coursesName];
    const randomIndex = Math.floor(Math.random() * dishes.length);
    return dishes[randomIndex];
  },
  
  generateRandomMeal() {
    const appetizer = this.getRandomDishCourse('appetizers');
    const mains = 
this.getRandomDishCourse('mains');
		const dessert = 
this.getRandomDishCourse('desserts')  ;
    const totalPrice = 
appetizer.price + main.price + dessert.price  ;
    return 'Your meal is ' + appetizer.name  + ',' + main.name + 'and' + dessert.name + 'Your Grand Total Is : ' + totalPrice
}  
};


menu.addDishToCourse('appetizers' , 'Peas' , 3)
menu.addDishToCourse('mains' , 'Sushi' , 9)
menu.addDishToCourse('desserts' , 'Ice Cream' , 6)

#2

your getter methods of appetizers, mains and desserts does not return anything, which is problematic. Given then undefined is used, and undefined does not have a push method, as you can read from the error message

Given you use getters and setters, the _appetizers should have a underscore prefix


#3

Could You Explain Me With A Code and more basic i guess?


#4

getters and setters allows us to modify behavior of properties:

o = {
  _x: [],
  y: [],
  get x(){
    return this._x.join('-');
  },
  set x(xIn){
    return this._x.push(xIn);
  }
}

o.x = 3;
o.x = 4;
o.x = 5;
console.log(o.x);

o.y = 6;
o.y = 7;
o.y = 8;
console.log(o.y);

the x property has getters and setters, the y property doesn’t.

When we assign a new value to x property, which we do here:

o.x = 3;
o.x = 4;
o.x = 5;

the setter method is called, the setter method will push the integer into the array. This is different from the default behavior we see for y property, where y is simply re-assigned

the getter method is called when we want to read the property:

console.log(o.x);

a string with hyphens is printed, the default would simple be the list

now the problem with your code is that you have getters, but the getters are emtpy, so they produce undefined.

the getters and setters in this program mostly implement default behavior for objects, which makes them almost redundant.


#5

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.