Search code examples
javascriptundefinedgetter-setter

JS setters return ''undefined'' and the getter causes Uncaught TypeError TypeError: Cannot convert undefined or null to object


I am trying to create a simple js program of "Today's menu" using setters and getters. The program is intended to return a random key and a value of the food and the price respectivly from an array of objects.

The problem is that even it the logic is somehow OK the setters return undefined when i call :

console.log(menu.priceToCheck);
console.log(menu.mealToCheck) ;

Because of this matter when i finally try to call the getter it causes the error :

TypeError TypeError: Cannot convert undefined or null to object

The expected output should be for example :

The menu today has pizza for only 13 dollars

There is something i cannot understand as a newbee with javascript . Here is my code below :

let menu = {
  
    _meals : [
        {"burger": 14},
        {"mouzakas": 12},
        {"pasta": 10},
        {"pizza": 13},
    ],

    
    set meal(mealToCheck) {
      if (typeof mealToCheck === 'string') {
        let random_index = Math.floor(Math.random() * this._meals.length);
        let new_obj = this._meals[random_index];
        return new_obj = mealToCheck;
        
      }
      else {
        return 'input error';
      }
      
    },
    
    set price(priceToCheck) {
      if (typeof priceToCheck === 'number') {
        
        return Object.values(this.new_obj) = priceToCheck;
      }
      else {
        return 'input error';
      }
     
    },
    
    get todaysSpecial() {
     if (Object.keys(this.new_obj) !== '' && Object.values(this.new_obj) !== 0) {
        return  'The menu today has ' + Object.keys(this.new_obj) + ' for only ' + Object.values(this.new_obj) + ' dollars';

      }
     else {
       return 'Meal or price was not set correctly!'
      }
   }
    
    
    
    
    
    };
    
    console.log(menu.priceToCheck);
    console.log(menu.mealToCheck) ;
    console.log(menu.todaysSpecial);

Upate : Without getters and setters the code below is ok BUT FOR PRACTICE REASONS I WANT TO USE GETTERS AND SETTERS :

meals = [
    {"burger": 14},
    {"mouzakas": 12},
    {"pasta": 10},
    {"pizza": 13},
];


let random_index = Math.floor(Math.random() * meals.length);

let obj = meals[random_index];

console.log(obj[0]);

console.log('The menu today has ' + Object.keys(obj) + ' for only ' + Object.values(obj) + ' dollars');



console.log(Object.keys(obj));
console.log(Object.values(obj));

Solution

  • You are never using the setters for priceToCheck or mealToCheck and you never defined a getter for that

    What I would do based on the code your provided:

    const menu = {
      meals: [{
          "burger": 14
        },
        {
          "mouzakas": 12
        },
        {
          "pasta": 10
        },
        {
          "pizza": 13
        },
      ],
      printMealOfTheDay() {
        if (!this.mealOfTheDay) {
          let random_index = Math.floor(Math.random() * this.meals.length);
          let obj = this.meals[random_index];
          this.mealOfTheDay = obj
        }
    
        return 'The menu today has ' + Object.keys(this.mealOfTheDay) + ' for only ' + Object.values(this.mealOfTheDay) + ' dollars'
      }
    }
    
    console.log(menu.printMealOfTheDay())
    console.log(menu.printMealOfTheDay())