当我尝试在嵌套对象中使用getter和setter时出错

时间:2020-01-17 16:07:17

标签: javascript

我正在尝试构建一个拾饭器。以下代码-不嵌套getter和setter的情况下运行正常。

const menu = {
   _courses: {
     appetizers: [],
     mains: [],
     desserts: []
   },
  get appetizers(){
      return this._courses.appetizers;
    },
  set appetizers(appetizerDish){
      this._courses.appetizers = appetizerDish;
    },
  get mains(){
      return this._courses.mains;
    },
  set mains(mainDish){
      this._courses.mains = mainDish;
    },
  get desserts(){
      return this._courses.desserts;
    },
    set desserts(dessertDish){
      this._courses.desserts = dessertDish;
    },

 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){
    let dishes = this._courses[courseName];
    return dishes[Math.floor(Math.random() * dishes.length)]
  },
  
  generateRandomMeal () {
    let appetizer = this.getRandomDishFromCourse('appetizers');
    let main = this.getRandomDishFromCourse('mains');
    let dessert = this.getRandomDishFromCourse('desserts');
    let totalPrice = appetizer.price + main.price + dessert.price;
    return `Order ${appetizer.name}, ${main.name} and ${dessert.name} for Rs.${totalPrice}.`
  }
  
};

menu.addDishToCourse('appetizers', 'Honey Chilli Potatos', 180);
menu.addDishToCourse('mains', 'Fing with Tingmo', 260);
menu.addDishToCourse('desserts', 'Newyork Cheesecake', 280);

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

但是,如果我尝试将它们嵌套在_courses中,则会引发以下错误:

home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:6
      return this._courses.appetizers;
                          ^

TypeError: Cannot read property 'appetizers' of undefined
    at Object.get appetizers [as appetizers] (/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:6:27)
    at Object.addDishToCourse (/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:38:25)
    at Object.<anonymous> (/home/ccuser/workspace/learn-javascript-objects-meal-maker/app.js:53:6)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.runMain (module.js:605:10)
    at run (bootstrap_node.js:427:7)

以下是我尝试嵌套获取器和设置器的方法:

变化1:

const menu = {
  _courses: {
    appetizers: [],
    get appetizers(){
      return this.appetizers;
    },
    set appetizers(appetizerDish){
      this.appetizers = appetizerDish;
    },
  ...
  }

变化2:

...
 _courses: {
    appetizers: [],
    get appetizers(){
      return this._courses.appetizers;
    },
    set appetizers(appetizerDish){
      this._courses.appetizers = appetizerDish;
    },
    ...
  },
...

我不明白为什么这些都不起作用。

0 个答案:

没有答案