為什麼 JavaScript 不允許直接在物件文字中使用動態物件鍵？

變數難題中的JavaScript 物件鍵

在JavaScript 中使用物件文字時，您可能會遇到一種特殊的行為，即將變數指派給動態變數屬性鍵不起作用。考慮以下兩個程式碼片段：

<something>.stop().animate({ 'top': 10 }, 10); // Works
var thetop = 'top';
<something>.stop().animate({ thetop: 10 }, 10); // Doesn't work

為什麼會有差異？

第一個片段利用點符號成功設定了物件的「top」屬性。但是，第二個片段失敗了，因為 JavaScript 不允許使用變數直接在物件字面量中定義動態物件屬性名稱。

ES5 及更早版本中的解

分配動態ES5 及更早版本中變數的屬性名稱，您必須手動建構物件文字：

var thetop = "top";
var aniArgs = {};
aniArgs[thetop] = 10; // Assign value to variable property name
<something>.stop().animate(aniArgs, 10);

解決方案ES6及更高版本

ES6 在物件字面量語法中引入了“CompulatedPropertyName”，可以直接從變數分配動態屬性名稱：

var thetop = "top",
    obj = { [thetop]: 10 };
console.log(obj.top); // -> 10

最新版本支援此語法主要瀏覽器。

以上是為什麼 JavaScript 不允許直接在物件文字中使用動態物件鍵？的詳細內容。更多資訊請關注PHP中文網其他相關文章！