105

为什么 JavaScript 不允许模板字符串作为对象属性键？例如，当我输入：

foo = {`bar`: 'baz'}

进入 NodeJS REPL，它会抛出一个SyntaxError带有“意外模板字符串”的长堆栈跟踪。然而，属性值很好，这并不出人意料。类似的错误发生在浏览器中，例如，Firebug 抛出一个SyntaxError带有“invalid property id”的错误。

“计算的属性名称”中允许使用模板字符串。例如，这在所有支持语法的浏览器中编译得非常好：

var foo = {
    [`bar` + 1]: `baz`
};

并创建对象{"bar1": "baz"}。

为什么不允许模板字符串作为文字对象键？是出于性能原因吗？必须编译模板字符串，可能在运行时（如果我错了，请纠正我），这意味着每次遇到此对象时，解释器都必须计算对象名称。考虑到诸如“熟”模板字符串之类的因素，这似乎会变慢，尽管自 ES5 以来我们已经有了 getter 和 setter。Firefox 没有将此作为错误提及，这就是我发现它出乎意料的原因。将来某个时候会允许使用这种语法吗？

4

3 回答 3

84

为什么不允许模板字符串作为文字对象键？

模板字符串是表达式，而不是文字1。您只能将字符串文字（和标识符）用于属性名称，对于其他所有内容 - 不知道是静态的 - 您需要一个计算的属性名称。

是出于性能原因吗？

不，这不太可能。这是为了简化解析，并且可以很容易地将常量（静态已知）属性名称与动态计算的属性名称区分开来。

大多数情况下，这是一项没有人需要的功能。它不会简化或缩短任何东西，您可以使用它实现的目标。

将来某个时候会允许使用这种语法吗？

没有。

1：即使它们被称为“模板文字”，从技术上讲，它们也不是文字。而且：模板甚至不需要是字符串，它们可以评估为任何东西。

于 2016-03-09T20:41:33.623 回答
16

对象键应该是字符串。

如果作为键提供的表达式不是字符串，引擎将尝试将其强制转换为字符串。

模板字符串不是“可强制的”，因此，引擎在尝试强制它们时抛出错误......

另一方面，数组自然可以强制转换为字符串，因此可以用作完全合法的键（示例 1）

此外，包含模板字符串的数组可以在创建对象时用作完全合法的键，因为引擎首先评估模板表达式，然后将数组强制转换为字符串（示例 2）

见例子：

    /* example 1 */ {`foo`: "bar"}   // Error: template strs aren't coersible

为了能够将模板字符串用作对象键，只需将其包装为数组的单个元素：

    /* example 2 */ {[`foo`]: "bar"} /* OK: {foo: "bar"}, the internal `foo` 
                                           template is first resolved to a native 
                                           "foo" string, resulting in array ["foo"],
                                           which then coersed to the "foo" key.*/
    
    /* example 3 */ const obj = {foo: "bar"}
                        const obj1 = {[obj.foo]: "bar"} // OK: {bar: "bar"} !!
于 2021-05-27T12:50:03.917 回答
3

我发布这个答案是为了提升@Bergi 对答案的高度评价。如果您想使用变量中的动态值作为对象字面量中的对象键，只需使用计算属性：

const dynamicKey = someCondition ? 'someKeyName' : 'otherKeyName';
const obj = {[dynamicKey]: val};

你也可以这样写：

const obj = {[`${dynamicKey}`]: val};

但为什么要打扰？

于 2021-11-23T11:44:55.360 回答