如何在JavaScript对象文字中使用变量作为键？

Question

如何在JavaScript对象文字中使用变量作为键？为什么以下工作？<something>.stop().animate(     { 'top' : 10 }, 10 );虽然这不起作用：var thetop = 'top';<something>.stop().animate(     { thetop : 10 }, 10);为了使它更清晰：目前我无法将CSS属性作为变量传递给animate函数。

Answer 1

使用ECMAScript 2015，您现在可以使用括号表示法直接在对象声明中执行此操作： 

var obj = {
  [key]: value}

哪里key可以是任何类型的表达式（例如变量）返回值。

所以这里你的代码看起来像：

<something>.stop().animate({
  [thetop]: 10
}, 10)

哪里thetop将被变量值取代。

Answer 2

我已使用以下内容向对象添加具有“动态”名称的属性：

var key = 'top';$('#myElement').animate(
   (function(o) { o[key]=10; return o;})({left: 20, width: 100}),
   10);

key 是新属性的名称。

传递给的属性的对象animate将是{left: 20, width: 100, top: 10}

这只是使用[]其他答案推荐的必需符号，但代码行数较少！