JavaScript TypeError，無法讀取未定義的屬性，但函數已定義。 我究竟做錯了什么？

Question

我不斷收到錯誤消息：“ TypeError：無法讀取未定義的屬性'push'”

錯誤在以下行中：“ this.courseName.push（dish）;”

這是代碼：

let menu = {
    _courses: {
      _appetizers:[] ,
      _mains:[],
      _desserts: []
    },

    addDishToCourse(courseName, dishName, dishPrice){
        const dish = { name: this.dishName, price: this.dishPrice };

        // ERROR HERE: **this._courses[courseName].push(dish);**
    },
};

我已經被這個錯誤困擾了幾個小時。 有沒有我看不到的東西嗎？

抱歉，如果有一個簡單的解決方案。 我對JavaScript比較陌生。

編輯：

我確實是錯誤地調用了密鑰。 我現在將該函數稱為：

  menu.addDishToCourse("_appetizers", "random", 10);
  console.log(menu._courses._appetizers);

當我在編譯器中登錄時，它返回：

    [ { name: undefined, price: undefined } ]

似乎沒有調用該函數。 我是否從根本上錯誤地解決了這個問題？

Answer 1

問題在於scope 。

this是object本身（在這種情況下為菜單），並具有_courses和addDishToCourse作為其屬性。

在addDishToCourse內部， this是在查看object的dishName和dishPrice ，但它們的作用域dishPrice於函數本身（通過參數）。

因此正確的代碼如下所示：

let menu = {
        _courses: {
            _appetizers: [],
            _mains: [],
            _desserts:[]
        },

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

            this._courses[courseName].push(dish);
        }
    }    

menu.addDish("_mains", "Pizza", "10");

Answer 2

您的第一個問題是，您向函數傳遞了錯誤的courseName ，這就是為什么會出現錯誤。

第二個問題是使用{ name: this.dishName, price: this.dishPrice }時，您分配了錯誤的值來反對將您的課程數組推入。

實際上，當您使用this.dishName您試圖從menu對象中獲取dishName ，這就是undefined的原因，您只需要使用參數dishName和dishPrice dishName ， dishPrice可以將參數傳遞給該函數。

    const dish = {
      name: dishName,
      price: dishPrice
    };

    this._courses[courseName].push(dish);

這是一個有效的演示：

 let menu = { _courses: { _appetizers: [], _mains: [], _desserts: [] }, addDishToCourse(courseName, dishName, dishPrice) { const dish = { name: dishName, price: dishPrice }; this._courses[courseName].push(dish); }, }; menu.addDishToCourse("_appetizers", "random", 10); console.log(menu._courses._appetizers);