在 ES6 的对象初始化中使用动态属性名称

在编程中经常会出现使用从外部源派生的属性名称创建对象的挑战。在查询中描述的场景中，我们尝试构造一个 JavaScript 对象，其属性的键在单独的变量 KEYS 中定义。

但是，在为对象内的属性赋值时，我们遇到错误由于使用了点运算符 (.)。该运算符是为文字对象属性名称保留的，不能与动态属性名称一起使用。

为了解决这个问题，我们求助于 ES6 (EcmaScript 2016) 的力量，它是 JavaScript 标准的最新补充，引入了更多内容表达性语法和特征。这些功能之一是计算属性语法，它允许我们动态定义属性名称。

使用计算属性语法，我们可以重写代码如下，这将成功创建具有所需动态属性的对象名称：

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

在此代码中，属性名称两边的方括号 ([]) 表明我们正在使用计算属性语法。括号内的表达式计算为动态属性名称，该名称是从 KEYS 变量中检索的。