Error in Meal Maker Project

I’m stuck on step 12 of the Meal Maker project. I keep getting the following error: RangeError: Maximum call stack size exceeded. From what I can tell everything I wrote looks like what is in the project walkthrough video. If anyone could point out where I went wrong I would greatly appreciate it. I’m very new to programing so I’m sure the solution is something simple that I’m just overlooking.

https://www.codecademy.com/courses/introduction-to-javascript/projects/meal-maker?action=resume_content_item

My Code:

const menu = {
  _courses: {
    apetizers: [],
    mains: [],
    desserts: [],
  },
  get appetizers() {
    return this._courses.appetizers;
  },
  get mains() {
    return this._courses.mains;
  },
  get desserts() {
    return this._courses.desserts;
  },
  set appetizers(appetizersIn) {
    this._courses.appetizers = appetizersIn;
  },
  set mains(mainsIn) {
    this._courses.mains = mainsIn;
  },
  set desserts(dessertsIn) {
    this._courses.desserts = dessertsIn;
  },
  get _courses() {
    return {
      appetizers: this.appetizers,
      mains: this.mains,
      desserts: this.desserts,
    }
  },
  addDishToCourse (courseName, dishName, price) {
    const dish = {
      name: dishName,
      price: price,
    }
    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 = getRandomDishFromCourse(appetizers);
    const main = getRandomDishFromCourse(mains);
    const dessert = getRandomDishFromCourse(desserts);
    const price = appetizer.price + main.price + dessert.price
    const meal = `Appetizer: ${appetizer}, Main: ${main}, Dessert: ${dessert}, Total Price: $${price}`;
  }
};

menu.addDishToCourse('appetizers', 'salad', 5.50);
menu.addDishToCourse('appetizers', 'soup', 4);
menu.addDishToCourse('appetizers', 'nachos', 5);

menu.addDishToCourse('mains', 'pasta', 10);
menu.addDishToCourse('mains', 'chicken', 8.50);
menu.addDishToCourse('mains', 'lamb', 11);

menu.addDishToCourse('desserts', 'cookies', 4);
menu.addDishToCourse('desserts', 'ice cream', 4.50);
menu.addDishToCourse('desserts', 'affogato', 5);
  get _courses() {
    return {
      appetizers: this.appetizers,
      mains: this.mains,
      desserts: this.desserts,
    }
  },

The above contains a circular reference. It should be,

get courses () {

}
4 Likes

Thanks for the reply! When I delete the body of the function like that I receive the following: TypeError: Cannot read property ‘appetizers’ of undefined.

Also, lines 25 through 31 in the walkthrough video appear to be identical to what I have. Is there anything else that it might be? Sorry if I’m also not understanding your suggestion correctly.

3 Likes

Keep the body, just change the name.

2 Likes