如何在ES5中使用计算的属性名称？

Question

我想要一个经过计算的属性名称。我看到您可以在ES6中使用它。但是它应该与IOS Webview兼容。所以我不能使用ES6。而且，如果这会使某人更容易，则计算出的名称在循环内也将始终相同。

有任何想法吗？

var today = moment().format('DD.MM.YY');
for (var i = 0; i < 5; i++) {
    initialData.push(
         {
            dates: {
                "01.01.01": false
                 // instead of 01.01.01 i would like to have the value of today as the key
            }
        }
    )
}

Answer 1

如果您碰巧拥有完整的 ES6+ 语法代码（例如计算属性名称），并且您希望使其兼容 ES5，那么迄今为止最简单的方法是使用像Babel这样的转译器自动为您完成此操作。这将允许您用该语言的最新且最易读的版本编写源代码，同时允许过时的浏览器理解转译的代码，而不必自己搞乱丑陋且冗长的 ES5 语法。

例如，如果您的源代码如下所示，您希望使其兼容 ES5：

const prop1 = 'foo';
const prop2 = 'bar';
const prop3 = 'baz';
const obj = {
  [prop1]: 'val1',
  [prop2]: 'val2',
  [prop3]: 'val3',
};

console.log(obj);

你可以通过Babel运行它并自动获取ES5版本：

"use strict";

var _obj;

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }
  return obj;
}

var prop1 = "foo";
var prop2 = "bar";
var prop3 = "baz";
var obj = ((_obj = {}),
_defineProperty(_obj, prop1, "val1"),
_defineProperty(_obj, prop2, "val2"),
_defineProperty(_obj, prop3, "val3"),
_obj);
console.log(obj);

转译的代码可能看起来有点难看，但大多数时候，您甚至不需要查看它，只需将其提供给客户端，它就会工作，即使在 Internet Explorer 等过时的环境中也是如此。

Answer 2

你必须在 ES5 中以复杂的方式来完成它：

var today  = moment().format('DD.MM.YY');
var obj    = {};
obj[today] = false;
for (var i = 0; i < 5; i++) {
  initialData.push({ dates: obj });
}

（或者如果每次迭代都不同，则将 的创建移到obj循环内部）