JavaScript Meal Maker Project Setters and Getters

Projects Skill Path Projects
1

Hi, I have a question about the point of using Getters and Setters methods in this project.
I write the same code as on “Project Walkthrough” and everything work fine, BUT I could not understund some parts of code so I read it carefully and deleated som parts of the code AND everything works the same without GETTER and SETTER methods.
So what for do I need thoes parts of code ?

Belowe original code

const menu = 
{
  _courses:
  {
    appetizers: [],
    mains: [],
    desserts: []
  },
  
//-----------------------------------
  
  get appetizers()
  {
    return this._courses.appetizers;
  },
  get mains()
  {
    return this._courses.mains;
  },
  get desserts()
  {
    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);
  },
  
//--------------------------------------
  
  getRandomDishFromeCourse(courseName)
  {
    const dishes =
    this._courses[courseName];
    const randomIndex =
    Math.floor(Math.random()*dishes.length);
    return dishes[randomIndex];
  },
  
//---------------------------------------
  
  generateRandomMeal()
  {
    const appetizer = 
    this.getRandomDishFromeCourse('appetizers');
    const main =
    this.getRandomDishFromeCourse('mains');
    const dessert =
    this.getRandomDishFromeCourse('desserts');
    
    const totalPrice = appetizer.price + main.price  + dessert.price;
    
    return `Your meal is ${appetizer.name}, ${main.name}, ${dessert.name}.
    The price is $${totalPrice}.`;
  }
};

//------------------------------------------
menu.addDishToCourse('appetizers', 'Pizza', 10);
menu.addDishToCourse('appetizers', 'Pasta', 10);
menu.addDishToCourse('appetizers', 'Pojo', 10);

menu.addDishToCourse('mains', 'Pierogi', 5);
menu.addDishToCourse('mains', 'Schabowy', 10);
menu.addDishToCourse('mains', 'Pomidorowa', 5);
 
menu.addDishToCourse('desserts', 'Losos', 12);
menu.addDishToCourse('desserts', 'Kraby', 15);
menu.addDishToCourse('desserts', 'Malze', 10);

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

Here are code after change

const menu = 
{
  _courses:
  {
    appetizers: [],
    mains: [],
    desserts: []
  },
  
//-----------------------------------
  
  addDishToCourse(courseName,dishName,dishPrice)
  {
    const dish =
    {
      name: dishName,
      price: dishPrice
    };
    return this._courses[courseName].push(dish);
  },
  
//--------------------------------------
  
  getRandomDishFromeCourse(courseName)
  {
    const dishes =
    this._courses[courseName];
    const randomIndex =
    Math.floor(Math.random()*dishes.length);
    return dishes[randomIndex];
  },
  
//---------------------------------------
  
  generateRandomMeal()
  {
    const appetizer = 
    this.getRandomDishFromeCourse('appetizers');
    const main =
    this.getRandomDishFromeCourse('mains');
    const dessert =
    this.getRandomDishFromeCourse('desserts');
    
    const totalPrice = appetizer.price + main.price  + dessert.price;
    
    return `Your meal is ${appetizer.name}, ${main.name}, ${dessert.name}.
    The price is $${totalPrice}.`;
  }
};

//------------------------------------------
menu.addDishToCourse('appetizers', 'Pizza', 10);
menu.addDishToCourse('appetizers', 'Pasta', 10);
menu.addDishToCourse('appetizers', 'Pojo', 10);

menu.addDishToCourse('mains', 'Pierogi', 5);
menu.addDishToCourse('mains', 'Schabowy', 10);
menu.addDishToCourse('mains', 'Pomidorowa', 5);
 
menu.addDishToCourse('desserts', 'Losos', 12);
menu.addDishToCourse('desserts', 'Kraby', 15);
menu.addDishToCourse('desserts', 'Malze', 10);

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

console.log(menu._courses)

And the parts that I removed

 /* get appetizers()
  {
    return this._courses.appetizers;
  },
  get mains()
  {
    return this._courses.mains;
  },
  get desserts()
  {
    return._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
    }
  }, */
  
//----------------------------------
1 Like
2

This question pops up now and then, understandable :wink: .

You are correct that the Getters and Setters are not being used in this context.

However one could think of some scenario’s in which you would use a getter or setter.

  • Say you want to bulk add / override dishes of your menu, you could use the setter for this.

  • You would like to get a print of the entire list of dishes, use your getter ;).

Anyways, even though you are not using them now, they might be useful in a different situation.
Besides that it is advisable and common practice to always implement setters and getters.

Perhaps you could give yourself a challenge in this exercise and see if you can modify your code in such a way it will use the setters and/or getters.

Happy coding!