Meal maker project issue setter doesn't work

Language Help
1

Hello, I am stuck with the Meal Maker exercise because my setters don’t work. My code is the same as in the explaining video :

const menu = {
_meal: '',
_price: 0,
set meal(mealToCheck) {
if (typeof mealToCheck === 'string') {
  return this._meal = mealToCheck;
}
},
set price(priceToCheck) {
if (typeof priceToCheck === 'number') {
  return this._price = priceToCheck; }
}
};

menu._meal = 245436;
menu._price = 'price';
console.log(menu);

And the output is this: { _meal: 245436, _price: ‘price’, meal: [Setter], price: [Setter] }

BUT the output shouldn’t include the modified values of _meal and _price because they don’t match the if condition of the setters…
So I still can change my values of _meal to numbers and my _price to a string and it’s logged… I don’t understand where is the problem…

2

Two things:

  • Setters need getters:
    get meal () {
        return this._meal
    }
  • setters do not need a return
    set meal (value) {
        this._meal = value
    }

    menu.meal = 'Fish and chips'
3

Thank you! But i have tried that but I still can put number values into _meal property and strings into _price…
check out my updated code:

const menu = {
_meal: '',
_price: 0,
set meal(mealToCheck) {
if (typeof mealToCheck === 'string') {
   this._meal = mealToCheck;
}
},
set price(priceToCheck) {
if (typeof priceToCheck === 'number') {
   this._price = priceToCheck; }
},
get todaysSpecial() {
  if ( this._meal && this._price) {
    return `Today\'s Special is ${this._meal} for $${this._price}!`;
  } else {
    return 'Meal or price was not set correctly!'
  }
}
};

menu._meal = 99;
menu._price = 'its a text';
console.log(menu.todaysSpecial);

the output: Today’s Special is 99 for $its a text!

1 Like
4

To repeat, setters need getters. We do not assign directly to the backing variable. Study the example above.

5

did that, still doesn’t work

6

Let’s see your code again, in full, please.

7 
const menu = {
_meal: '',
_price: 0,
set meal(mealToCheck) {
if (typeof mealToCheck === 'string') {
   this._meal = mealToCheck;
}
},
get meal() {
return this._meal;
},

set price(priceToCheck) {
if (typeof priceToCheck === 'number') {
   this._price = priceToCheck; }
},
get price() {
return this._price;
},
get todaysSpecial() {
  if ( this._meal && this._price) {
    return `Today\'s Special is ${this._meal} for $${this._price}!`;
  } else {
    return 'Meal or price was not set correctly!'
  }
}
};

menu._meal = 99;
menu._price = 'its a text';
console.log(menu.todaysSpecial);
8

By writing out the _ when you’re assigning new values, you’re accessing the properties directly which forgoes any getters and setters you have defined. The purpose of the _ is to indicate to a user of your interface that the properties of the object is not to be accessed directly. Therefore, you should only ever try to change the values by using the syntax provided with the getters and setters.

i.e.:

menu.meal = 99
menu.price = 'string'
console.log(menu.meal, menu.price)
// logs the original values, instead of the attempts at improperly redefining them
9

The purpose of using underscore variable names is obfuscate them from the outside, and as mentioned above, never accessing them directly, except with a getter or setter. Well written code gives no indication to the existence of these backing variables. That means only the accessor methods (get() and set()) ever make direct access.

For instance, consider,

To the untrained eye, the above looks like a getter, but in fact it is not. It is just a normal method and get is ignored.

    todaysSpecial () {
        if (this.meal && this.price) {
            return `Today\'s Special is ${this.meal} for $${this.price}!`;
        } else {
            return 'Meal or price was not set correctly!'
        }
    }

Now assuming the values are set using the conventional syntax mentioned above, their values are retrieved by the respective getters.

10

Yes! That was my mistake I couldn’t see, thank you so much! now its working

11

This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.