如何使用動態屬性名稱建立 JavaScript 物件？

使用動態屬性名稱建立物件

在 JavaScript 中，物件通常使用文字鍵值對來定義。但是，在某些情況下，您可能會遇到屬性名稱是動態的或在建立物件時未知的情況。這可以透過使用括號表示法來實現。

問題：

考慮以下程式碼片段：

var KEYS = {} ;

KEYS.PHONE_TYPE = 'phone-type';
KEYS.AGENT_TYPE = 'agent-type';

var myAppConfig = {
    ...
    iconMap : { 
        KEYS.PHONE_TYPE : 'icon-phone', 
        KEYS.AGENT_TYPE : 'icon-headphones'
    };
    ...
};

此程式碼失敗錯誤「預期為':'，卻看到了'. '。為了解決這個問題，你需要使用括號符號 [] 來動態存取屬性。

解決方案：

使用ES6（或像Babel/browserify 這樣的轉譯器），您可以使用括號表示法用動態屬性名稱初始化對象，如下所顯示：

iconMap : { 
    [KEYS.PHONE_TYPE] : 'icon-phone', 
    [KEYS.AGENT_TYPE] : 'icon-headphones'
};

在此在程式碼中，KEYS 屬性周圍的方括號[] 允許您根據KEYS 物件中儲存的值動態指定屬性名稱。因此，myAppConfig 物件的 iconMap 屬性將包含所需的值映射：

{
    'phone-type' : 'icon-phone',
    'agent-type' : 'icon-headphones'
}

以上是如何使用動態屬性名稱建立 JavaScript 物件？的詳細內容。更多資訊請關注PHP中文網其他相關文章！