Meal Maker - Length reader error

Howdy everyone,
If you’re reading this post, thanks for taking a look at this and thank you for any help you can provide!
I’ve been working on the meal maker project and am getting an error with the read .length property (line 41). I think the issue has to do with my array dishes, but I can’t see where I have a loose end.
Any ideas why I might be getting the error?
Many thanks,

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.appetizers = 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('appetizer'); const main = this.getRandomDishFromCourse('main'); const dessert = this.getRandomDishFromCourse('dessert'); const totalPrice = appetizer.price + main.price + dessert.price; console.log(`Your meal will have an appetizer as ${appetizer} the main course of ${main} and a dessert of ${dessert}. The total price of the meal will be ${totalPrice}.`) } }; menu.addDishToCourse('appetizers', 'bruschetta', 7.50); menu.addDishToCourse('appetizers', 'farinata', 5.00); menu.addDishToCourse('appetizers', 'antipasti', 4.50); menu.addDishToCourse('mains', 'pizza', 10.25); menu.addDishToCourse('mains', 'tagliatelle', 11.50); menu.addDishToCourse('mains', 'gnocchi', 12.15); menu.addDishToCourse('desserts', 'ice cream', 3.00); menu.addDishToCourse('desserts', 'cake', 1.25); menu.addDishToCourse('desserts', 'coffee', 3.25); const meal = menu.generateRandomMeal(); console.log(meal);

This error is often caused when you have an object and try to get the value from non-existing property.

so the first step of debugging this problem should be to look at the available properties/keys on the object and what key/property you try to use:

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

add the .log() to your code, run your code, and look at the output. See a problem?

Thanks for your reply! So what I see is the objects that should be storing arrays of each type of dish, that means my code is rather accessing the length of the _courses object, rather than the next level down appetizers array, for example.
Am I on the right track?

May Object.keys() might have confused you. You are not on the right path

my point was that the available courses are appetizers, mains and desserts (all plural). Yet you use appetizer (singular) to get the right course. That won’t work

Ah yeah I saw that and made the change, but for some reason I was getting an error still. Anyways, I just copied my code from above back into the project and changed the courses to plurals and it worked. I think I must have changed something else in my efforts to figure out the problem (after your response).
I also noticed I had an error with my variable in the final .log that described the randomly selected meal so I fixed that as well.
None the less, kind thanks for your help! I spent way to long looking at this problem for how simple the solution was (facepalm).

1 Like