TypeError: Cannot read property 'push' of undefined

I have been getting this error through out, kindly point me towards the right direction:

const menu = {
  // setting the courses object
  _courses: {
    // creating property arrays
    appetizers: [],
    mains: [],
    desserts: [],

    // creating getter and setter methods 
    get appetizers() {
      return this._courses.appetizers;
    },

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

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

    // setters
    set appetizers(appetizers) {
      this._courses.appetizers = appetizers;
    },

    set mains(mains) {
      this._courses.mains = mains;
    },

    set desserts(desserts) {
      this._courses.desserts = desserts;
    }

  },

  // courses ends here

  // getter for courses
  get courses() {
     return {
       appetizers: this._courses.appetizers,
       mains: this._courses.mains,
       desserts: this._courses.desserts
     };
  },

  // adding dishes to the course
  addDishToCourse(courseName, dishName, dishPrice) {
    const dish = {
      name: dishName,
      price: dishPrice
    };
    this._courses[courseName].push(dish);
  },

  // generating a random meal
  getRandomDishFromCourse(courseName){
    const dishes = this._courses[courseName];
    const randomIndex = Math.floor(Math.random() * dishes.length);
     return dish[randomIndex];
  },
 
//  generating a random meal
  generateRandomMeal ()  {
    const appetizer = getRandomDishFromCourse(appetizers);
    const main = getRandomDishFromCourse(mains);
    const dessert = getRandomDishFromCourse(desserts);
    const totalPrice = appetizers.price + mains.price + desserts.price;

    return 'The total price for ' + appetizer.name + ', ' + main.name + ', ' + dessert.name + ' is ' + totalPrice
  }
};

menu.addDishToCourse('appetizer', 'french fries', 20);
menu.addDishToCourse('appetizer', 'mandazi', 167);
menu.addDishToCourse('appetizer', 'Mahamri', 99);

menu.addDishToCourse('mains', 'pilau', 220);
menu.addDishToCourse('mains', 'biriani', 320);
menu.addDishToCourse('mains', 'shawarma', 67);

menu.addDishToCourse('desserts', 'bhajia', 89);
menu.addDishToCourse('desserts', 'tende', 14);
menu.addDishToCourse('desserts', 'viazi', 9);

// generating a random meal
let meal = menu.generateRandomMeal();

console.log(meal);



This is my code which returns the following error

'get', 'set' ]
/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:61
    const appetizer = getRandomDishFromCourse(appetizers);
                      ^

ReferenceError: getRandomDishFromCourse is not defined

My code

const menu = {
  // setting the courses object
  _courses: {
    // creating property arrays
    appetizers: [],
    mains: [],
    desserts: [],

    // creating getter and setter methods 
    get: function() {
      return this.appetizers;
      return this.mains;
      return this.desserts;
    },
    // setters
    set: function(appetizers) {
      this.appetizers = appetizers;
    },

    set: function(mains) {
      this.appetizers = mains;
    },

    set: function(desserts) {
      this.desserts = desserts;
    }

  },

  // courses ends here

  // getter for courses
  get courses() {
     return {
       appetizers: this._courses.appetizers,
       mains: this._courses.mains,
       desserts: this._courses.desserts
     };
  },

  // adding dishes to the course
  addDishToCourse(courseName, dishName, dishPrice) {
    const dish = {
      name: dishName,
      price: dishPrice
    };
    console.log(courseName, Object.keys(this._courses));
    this._courses[courseName].push(dish);
  },

  // generating a random meal
  getRandomDishFromCourse(courseName){
    const dishes = this._courses[courseName];
    const randomIndex = Math.floor(Math.random() * dishes.length);
    comsole.log
     return dish[randomIndex];
  },
 
//  generating a random meal
  generateRandomMeal ()  {
    const appetizer = getRandomDishFromCourse(appetizers);
    const main = getRandomDishFromCourse(mains);
    const dessert = getRandomDishFromCourse(desserts);
    const totalPrice = appetizers.price + mains.price + desserts.price;

    return 'The total price for ' + appetizer.name + ', ' + main.name + ', ' + dessert.name + ' is ' + totalPrice
  }
};

menu.addDishToCourse('appetizers', 'french fries', 20);
menu.addDishToCourse('appetizers', 'mandazi', 167);
menu.addDishToCourse('appetizers', 'Mahamri', 99);

menu.addDishToCourse('mains', 'pilau', 220);
menu.addDishToCourse('mains', 'biriani', 320);
menu.addDishToCourse('mains', 'shawarma', 67);

menu.addDishToCourse('desserts', 'bhajia', 89);
menu.addDishToCourse('desserts', 'tende', 14);
menu.addDishToCourse('desserts', 'viazi', 9);

// generating a random meal
let meal = menu.generateRandomMeal();

console.log(meal);


Hi @peterngugi0464500303
there are several problems with this object:

  1. You have duplicate keys because your getters and setters are in the same scope as the targeted object keys:

That also means that this._courses cannot be found because there is no further key called this._courses in the _courses object.

  1. After you fixed that you’ll get an error 'undefined is not an ‘object’ which means that the key which has the array to be pushed to assigned as its value cannot be found in the method addDishToCourse.

this._courses[courseName] // --> undefined

To find the error add a console to the addDishToCourse method that logs the argument you receive: courseName and compare it with the key of the array you want to push the dish to: Object.keys(this._courses).
console.log(courseName, Object.keys(this._courses));

  1. The last problem is in your getRandomDishFromCourse method: dish is not defined therefore undefined will be returned.

this is the error I get at stage 2: kindly point me towards the right direction once again

desserts [ 'appetizers', 'mains', 'desserts' ]
/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:59
    const appetizer = getRandomDishFromCourse(appetizers);
                      ^

That is the the error message you get due to the error described in point 3.

my updated code

const menu = {
  // setting the courses object
  _courses: {
    // creating property arrays
    appetizers: [],
    mains: [],
    desserts: [],
  },

  // courses ends here
  // creating getter and setter methods 
    get: function() {
      return this.appetizers;
      return this.mains;
      return this.desserts;
    },
    // setters
    set: function(appetizers) {
      this.appetizers = appetizers;
    },

    set: function(mains) {
      this.appetizers = mains;
    },

    set: function(desserts) {
      this.desserts = desserts;
    },

  // getter for courses
  get courses() {
     return {
       appetizers: this._courses.appetizers,
       mains: this._courses.mains,
       desserts: this._courses.desserts,
     };
  },

  // adding dishes to the course
  addDishToCourse(courseName, dishName, dishPrice) {
    const dish = {
      name: dishName,
      price: dishPrice
    };
    console.log(courseName, Object.keys(this._courses));
    this._courses[courseName].push(dish);
  },

  // generating a random meal
  getRandomDishFromCourse(courseName){
    const dishes = this._courses[courseName];
    const randomIndex = Math.floor(Math.random() * dishes.length);
    comsole.log
     return dish[randomIndex];
  },
 
//  generating a random meal
  generateRandomMeal ()  {
    const appetizer = getRandomDishFromCourse(appetizers);
    const main = getRandomDishFromCourse(mains);
    const dessert = getRandomDishFromCourse(desserts);
    const totalPrice = appetizers.price + mains.price + desserts.price;

    return 'The total price for ' + appetizer.name + ', ' + main.name + ', ' + dessert.name + ' is ' + totalPrice
  }
};

menu.addDishToCourse('appetizers', 'french fries', 20);
menu.addDishToCourse('appetizers', 'mandazi', 167);
menu.addDishToCourse('appetizers', 'Mahamri', 99);

menu.addDishToCourse('mains', 'pilau', 220);
menu.addDishToCourse('mains', 'biriani', 320);
menu.addDishToCourse('mains', 'shawarma', 67);

menu.addDishToCourse('desserts', 'bhajia', 89);
menu.addDishToCourse('desserts', 'tende', 14);
menu.addDishToCourse('desserts', 'viazi', 9);

// generating a random meal
let meal = menu.generateRandomMeal();

console.log(meal);



Point 3 hasn’t been corrected yet (I see that you added a variable declaration, but take a closer look). Now you also added invalid code and produced a syntax error:

corrections made following points 1,2,3

const menu = {
  // setting the courses object
  _courses: {
    // creating property arrays
    appetizers: [],
    mains: [],
    desserts: [],
  },

  // courses ends here
  // creating getter and setter methods 
    get: function() {
      return this.appetizers;
      return this.mains;
      return this.desserts;
    },
    // setters
    set: function(appetizers) {
      this.appetizers = appetizers;
    },

    set: function(mains) {
      this.appetizers = mains;
    },

    set: function(desserts) {
      this.desserts = desserts;
    },

  // getter for courses
  get courses() {
     return {
       appetizers: this._courses.appetizers,
       mains: this._courses.mains,
       desserts: this._courses.desserts,
     };
  },

  // adding dishes to the course
  addDishToCourse(courseName, dishName, dishPrice) {
    const dish = {
      name: dishName,
      price: dishPrice
    };
    console.log(courseName, Object.keys(this._courses));
    this._courses[courseName].push(dish);
  },

  // generating a random meal
  getRandomDishFromCourse(courseName){
    const dishes = this._courses[courseName];
    const randomIndex = Math.floor(Math.random() * dishes.length);
     return dishes[randomIndex];
  },
 
//  generating a random meal
  generateRandomMeal ()  {
    const appetizer = getRandomDishFromCourse(appetizers);
    const main = getRandomDishFromCourse(mains);
    const dessert = getRandomDishFromCourse(desserts);
    const totalPrice = appetizers.price + mains.price + desserts.price;

    return 'The total price for ' + appetizer.name + ', ' + main.name + ', ' + dessert.name + ' is ' + totalPrice
  }
};

menu.addDishToCourse('appetizers', 'french fries', 20);
menu.addDishToCourse('appetizers', 'mandazi', 167);
menu.addDishToCourse('appetizers', 'Mahamri', 99);

menu.addDishToCourse('mains', 'pilau', 220);
menu.addDishToCourse('mains', 'biriani', 320);
menu.addDishToCourse('mains', 'shawarma', 67);

menu.addDishToCourse('desserts', 'bhajia', 89);
menu.addDishToCourse('desserts', 'tende', 14);
menu.addDishToCourse('desserts', 'viazi', 9);

// generating a random meal
let meal = menu.generateRandomMeal();

console.log(meal);



Now I get this error

desserts [ 'appetizers', 'mains', 'desserts' ]
/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:58
    const appetizer = getRandomDishFromCourse(appetizers);
                      ^

ReferenceError: getRandomDishFromCourse is not defined

You are calling your method within the object. That means you have to address it with this keyword as a prefix.

updated Error message

appetizers [ 'appetizers', 'mains', 'desserts' ]
appetizers [ 'appetizers', 'mains', 'desserts' ]
appetizers [ 'appetizers', 'mains', 'desserts' ]
mains [ 'appetizers', 'mains', 'desserts' ]
mains [ 'appetizers', 'mains', 'desserts' ]
mains [ 'appetizers', 'mains', 'desserts' ]
desserts [ 'appetizers', 'mains', 'desserts' ]
desserts [ 'appetizers', 'mains', 'desserts' ]
desserts [ 'appetizers', 'mains', 'desserts' ]
/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:58
    const appetizer = getRandomDishFromCourse(appetizers);

Same cause as described above…

Finally resolved, many deepest gratitude!

1 Like