Question about brackets in Meal Maker JS project

I just finished the Meal Maker project, and I had a question about something that’s not clear to me.

Just in case it helps, here’s my full code:

const menu = {
  _courses: {
    appetizers: [],
    mains: [],
    desserts: [],
  get appetizers () {
    return this._courses.appetizers
  set appetizers (appetizerIn) {
    this._courses.appetizers = appetizerIn
  get mains () {
    return this._courses.mains
  set mains (mainIn) {
    this._courses.mains = mainIn
  get desserts () {
    return this._courses.desserts
  set desserts (dessertIn) {
    this._courses.desserts = dessertIn
  get courses() {
    return {
      appetizers: this.appetizers,
      mains: this.mains,
      desserts: this.desserts
  addDishToCourse(courseName, dishName, dishPrice) {
    const dish = {
      name: dishName,
      price: dishPrice
  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 ${}, ${}, ${}. The total price is $${totalPrice}.`

menu.addDishToCourse('appetizers', 'Fried Mozzarella', 6.00);
menu.addDishToCourse('appetizers', 'Fried Pickles', 5.50);
menu.addDishToCourse('appetizers', 'Barbecue Chicken Flatbread', 8.25);

menu.addDishToCourse('mains', 'Chicken Piccata', 15.00);
menu.addDishToCourse('mains', 'Shrimp Scampi', 18.50);
menu.addDishToCourse('mains', 'Penne alla Vodka', 14.50);

menu.addDishToCourse('desserts', 'Brownie Sundae', 6.50);
menu.addDishToCourse('desserts', 'Tiramisu', 5.00);
menu.addDishToCourse('desserts', 'Pecan Pie', 5.25);

let meal = menu.generateRandomMeal()


What I actually have a question about is something that comes up a few times. Here’s an example of where it appears:

addDishToCourse(courseName, dishName, dishPrice) {
    const dish = {
      name: dishName,
      price: dishPrice

My question is, why does courseName need to be in brackets here and the other places where it appears? Why can’t we just use the dot notation, like:

Is it because courseName is a parameter in the addDishToCourse function, and those have to be in brackets if we’re using them to drill down into an object location?

Bracket notation is somewhat similar to arrays in how they’re accessed (via brackets). The key difference is that with brackets you have to use a key-name and with lists you use an index (no pun intended).

The dot invocations usually refer to attributes or methods.

The key difference in this example is you can’t say courses.courseName with a courseName parameter passing through but you can say courses[courseName] and it’ll be valid as long as the parameter is.

employee = {"name": "jon", "occupation": "plumber"}

// output: jon
// also same output: jon

test = { 

//output: hi