Meal Maker - getters and setters

Okay, I just finished Meal Maker after some real confusion and hours of beating my head against a wall. I still think I’m either missing something, or that the directions have superfluous steps. I was able to get the code to run, but I have three questions.
1)When do we want to use getters and setters exactly? It’s not clear to me yet.
2)We create getters and setters in this example, but I don’t see where they’re used. It seems to me that addDishToCourse(), getRandomDishFromCourse(), and generateRandomMeal() do all the work without ever making a call to the getters and setters we wrote? Am I missing something in the way this code executes, or are we creating unnecessary getters and setters just to confuse me? lol
3)Did I use the proper syntax on my setters? Would it be better to use a unique parameter name, or is it okay to use the same name as what I’m trying to assign to since the parameter only has method level scope?
Here is my code:

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.mains = 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('appetizers');
        const main = this.getRandomDishFromCourse('mains');
        const dessert = this.getRandomDishFromCourse('desserts');
        const totalPrice = appetizer.price + main.price + dessert.price;
        return `Your meal is ${appetizer.name}, ${main.name}, and ${dessert.name}. The total price is ${totalPrice}.`;

    }


  };

  menu.addDishToCourse("appetizers", "salad", 4.00);
  menu.addDishToCourse("appetizers", "wings", 9.00);
  menu.addDishToCourse("appetizers", "nachos", 7.00);
  menu.addDishToCourse("appetizers", "cheese sticks", 5.00);
  menu.addDishToCourse("appetizers", "fries", 3.00);
  menu.addDishToCourse("mains", "steak", 17.50);
  menu.addDishToCourse("mains", "salmon", 14.50);
  menu.addDishToCourse("mains", "pizza", 12.00);
  menu.addDishToCourse("mains", "meatloaf", 10.50);
  menu.addDishToCourse("mains", "tacos", 9.00);
  menu.addDishToCourse("mains", "enchiladas", 10.50);
  menu.addDishToCourse("desserts", "tiramisu", 11.00);
  menu.addDishToCourse("desserts", "apple crisp", 8.00);
  menu.addDishToCourse("desserts", "molten chocolate cake", 12.50);

  const meal = menu.generateRandomMeal();
  console.log(meal);

First my opinion: This project use getters and setters, but i don’t think they add much value, so its more confusing then helpful. So i will mostly focus on explaining getters and setters

getters and setters can be really useful. for example:

myObj = {
  _myArray: [],
  get myArray(){
    return this._myArray.join(' ');
  },
  set myArray(element){
    this._myArray.push(element);
  }
}

myObj.myArray = 3;
myObj.myArray = 4;
myObj.myArray = 5;
console.log(myObj.myArray);

Now the getter and setter have true value/meaning, they (getter and setter) do really change the behavior of the property

While the property (_myArray) is an array, the getter myArray returns a string. This could be useful to display nice output to the user.

the setter also changes the behavior, now assigning a value will push the value into the array (thanks to the setter)

Which is something you can do in mealmaker project:

    set appetizers(appetizer) {
      this._courses.appetizers.push(appetizer);
    },

i would make the parameter name single, given you only assign one dish at a time

which means, you can do assignment:

return this._courses[courseName] = dish

and the setter should handle pushing to array

furthermore, setters can be really useful to do validation.

So this project is showing you getters and setters, but not using them to their full potential

The stupid thing is, that we can still mutate the properties directly, its a shame JS doesn’t block accessing/mutating the property directly when getters and setters are used.

1 Like

Okay, thank you. That actually helps a little.

1 Like