Meal Maker project question regarding getter/setter implementation

Hey I just finished the Meal Maker project found on:

I ran into an issue while I was implementing the getter and setter functions. Please check addDishesToCourse() for my comments on the issue.

this.courseName = dish;
This is my line to call my setter. courseName is a parameter which is supposed to pass ‘appetizers’, ‘mains’, or ‘desserts’. However, this line actually creates a new object within menu called courseName with the dishes inside. Any one know why this is happening?

const menu= {
_courses: {

get appetizers (){
return this._courses._appetizers;
set appetizers (setApp){

get mains (){
return this._courses._mains;
set mains (setMain){

get desserts (){
return this._courses._desserts;
set desserts (setDesserts){

get courses(){
return {
_appetizers: this.appetizers,
_mains: this.mains,
_desserts: this.desserts

addDishesToCourse(courseName, dishName, dishPrice){
const dish = {
name: dishName,
price: dishPrice
if (courseName === ‘appetizers’) {
this.appetizers = dish;
} else if (courseName === ‘mains’) {
this.mains = dish;
} else if (courseName === ‘desserts’){
this.desserts = dish;
//this.courseName = dish; //why doesnt this work?
//above line creates a new object named courseName within ${menu}
//console.log(courseName); //logs correct parameter passed
//this._courses[courseName].push(dish); // without getter/setter

const dishes = this._courses[courseName];
const randomIndex = Math.floor(Math.random() * dishes.length);
return dishes[randomIndex]

let appetizer = this.getRandomDishFromCourse(’_appetizers’);
let main = this.getRandomDishFromCourse(’_mains’);
let dessert = this.getRandomDishFromCourse(’_desserts’);
let mealCost = appetizer.price + main.price + dessert.price;
return You ordered ${}, ${}, ${}. Total is ${mealCost}.;

menu.addDishesToCourse(‘appetizers’, ‘Salad’, 5);
menu.addDishesToCourse(‘appetizers’, ‘Calamari’, 6);
menu.addDishesToCourse(‘appetizers’, ‘Snails’, 7);
menu.addDishesToCourse(‘mains’, ‘Meatballs’, 8);
menu.addDishesToCourse(‘mains’, ‘Steak’, 10);
menu.addDishesToCourse(‘mains’, ‘Potatoes’, 9);
menu.addDishesToCourse(‘desserts’, ‘Ice Cream’, 1);
menu.addDishesToCourse(‘desserts’, ‘Puffs’, 2);
menu.addDishesToCourse(‘desserts’, ‘Cake’, 3);

const meal = menu.generateRandomMeal();


In javascript, objects are associative arrays and vice versa.

this means we end up with two ways to access properties/keys:

obj.prop // dot notation
obj['key'] /// associative array notation? 

When you have a string (courseName variable holds a string), you have to use associative array notation. You can’t use the dot nation. The dot notation only works with the name of the property.