Need Help with Meal Maker

Get Help Codecademy
#1

Hello, I was doing the meal maker project as a part of the back-end engineer career path and I ran into a syntax error that said that it couldn’t read the property of undefined: Uncaught TypeError: Cannot read property ‘appetizers’ of undefined
at Object.addDishToCourse (:33:25)
at :50:6


const menu = {
  _courses: {
    appetizers: [], 
    mains: [],
    desserts: [], 
  }, 
  get appetizers(){
    this.courses.appetizers; 
  }, 
  get mains(){
    this.courses.mains; 
  }, 
  get desserts(){
    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(){
    
  }, 
  addDishToCourse(courseName, dishName, dishPrice){
    const dish = {
      price: dishPrice, 
      name: dishName, 
    };
    return this._courses[courseName].push(dish);  
  },
  getRandomDishFromCourse(){
    const dishes = this.courses[courseName]; 
    let i = Math.floor(Math.random()*dishes.length); 
    return dishes[i]; 
  }, 
  generateRanodmMeal(){
    const appetizers = this.getRandomDishFromCourse('appetizers'); 
    const mains = this.getRandomDishFromCourse('mains'); 
    const desserts = this.getRandomDishFromCourse('desserts'); 
    const totalPrice = appetizer.price + mains.price + desserts.price; 
    return `Your appetizer is ${appetizers.name}, ${mains.name}, and ${desserts.name} Your total price is ${totalPrice}`; 
  }, 
}; 


menu.addDishToCourse('appetizers', 'wings', 4.58); 
menu.addDishToCourse('appetizers', 'fries', 3.54); 
menu.addDishToCourse('appetizers', 'chips', 2.65); 


menu.addDishToCourse('mains', 'pasta', 5.24); 
menu.addDishToCourse('mains', 'pizza', 6.14); 
menu.addDishToCourse('mains', 'spaghetti', 5.63); 


menu.addDishToCourse('desserts', 'cake', 3.91); 
menu.addDishToCourse('desserts', 'ice cream', 4.12); 
menu.addDishToCourse('desserts', 'brownie', 2.75); 

const meal = menu.generateRandomMeal();

console.log(meal);

Thanks to the legends who respond

#2

if we log this._courses:

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

    console.log(this._courses);
    return this._courses[courseName].push(dish);  
  },

we see undefined. So where does it come from? Looking at your getter:

  get _courses(){
    
  },

I don’t see anything returned. Which explains the undefined

1 Like
#3

That will cause a circular reference. Remove the backing prefix (underscore) when naming a getter.

1 Like
#4

Thanks, I completely forgot about that! I put return this.courses and I got the exact same syntax error :sweat:

const menu = {
  _courses: {
    appetizers: [], 
    mains: [],
    desserts: [], 
  }, 
  get appetizers(){
    this._courses.appetizers; 
  }, 
  get mains(){
    this.courses.mains; 
  }, 
  get desserts(){
    this.courses.desserts; 
  }, 
  set appetizers(appetizers){
    this.courses.appetizers = appetizers;
  }, 
  set mains(mains){
    this.couses.mains = mains; 
  }, 
  set desserts(desserts){
    this.couses.desserts = desserts; 
  }, 
  get _courses(){
    return this.courses; 
    },   
  addDishToCourse(courseName, dishName, dishPrice){
    const dish = {
      price: dishPrice, 
      name: dishName, 
    };
    return this._courses[courseName].push(dish);  
  },
  getRandomDishFromCourse(){
    const dishes = this.courses[courseName]; 
    let i = Math.floor(Math.random()*dishes.length); 
    return dishes[i]; 
  }, 
  generateRanodmMeal(){
    const appetizers = this.getRandomDishFromCourse('appetizers'); 
    const mains = this.getRandomDishFromCourse('mains'); 
    const desserts = this.getRandomDishFromCourse('desserts'); 
    const totalPrice = appetizer.price + mains.price + desserts.price; 
    return `Your appetizer is ${appetizers.name}, ${mains.name}, and ${desserts.name} Your total price is ${totalPrice}`; 
  }, 
}; 


menu.addDishToCourse('appetizers', 'wings', 4.58); 
menu.addDishToCourse('appetizers', 'fries', 3.54); 
menu.addDishToCourse('appetizers', 'chips', 2.65); 


menu.addDishToCourse('mains', 'pasta', 5.24); 
menu.addDishToCourse('mains', 'pizza', 6.14); 
menu.addDishToCourse('mains', 'spaghetti', 5.63); 


menu.addDishToCourse('desserts', 'cake', 3.91); 
menu.addDishToCourse('desserts', 'ice cream', 4.12); 
menu.addDishToCourse('desserts', 'brownie', 2.75); 

const meal = menu.generateRandomMeal();

console.log(meal);
#5

Thanks! removing the underscore fixed it!

#6

Like mtf says, this will cause circular reference. And there is no courses property, so this will still result in undefined

#7

Thanks for pointing that out :+1: