Question

我正在尝试这样的事情，但这个例子不起作用。

jsObj = {};

for (var i = 1; i <= 10; i++) {
    jsObj{'key' + i} = 'example ' + 1;
}

如何制作这样的动态按键？

Answer 1

方括号：

jsObj['key' + i] = 'example' + 1;

在JavaScript中，所有数组都是对象，但并非所有对象都是数组。主要区别（以及很难用直接JavaScript和普通对象模仿的那个）是数组实例保持length属性，以便它反映一个加上名称为numeric的属性的数值及其值，转换为数字时，是所有此类属性中最大的。这听起来很奇怪，但它只是意味着给定一个数组实例，名称如"0"，"5"，"207"等的属性都被特别处理，因为它们的存在确定length的值。最重要的是，length的值可以设置到删除这样的属性。将数组的length设置为0会有效地删除名称看起来像整数的所有属性。

好的，这就是使数组特殊的原因。但是，所有这些都与JavaScript [ ]运算符的工作原理无关。该运算符是一个对象属性访问机制，适用于任何对象。在这方面需要注意的是，就简单的属性访问而言，数值数组属性名称并不特殊。它们只是看起来像数字的字符串，但JavaScript对象属性名称可以是您喜欢的任何类型的字符串。

因此，[ ]运算符在迭代数组的for循环中的工作方式：

for (var i = 0; i < myArray.length; ++i) {
  var value = myArray[i]; // property access
  // ...
}

与访问名称为某个计算字符串的属性时[ ]的工作方式没有什么不同：

var value = jsObj["key" + i];

[ ]运算符在两个实例中都正在执行相同的操作。事实上，在一种情况下，所涉及的对象恰好是一个数组是不重要的，换句话说。

使用[ ] 设置属性值时，除了之外，故事与保持length属性的特殊行为相同。如果在数组实例上使用数字键设置属性：

myArray[200] = 5;

然后（假设“200”是最大的数字属性名称）length属性将更新为201作为属性赋值的副作用。但是，如果对普通对象做了同样的事情：

myObj[200] = 5;

没有这样的副作用。数组和对象的名为“200”的属性将以完全相同的方式设置为值5。

有人可能会认为，因为length行为很方便，所以你也可以创建所有对象的Array构造函数实例而不是普通对象。这没有什么直接的错误（虽然它可能会让人感到困惑，特别是对于熟悉其他语言的人来说，某些属性要包含在length中而不包含在其他属性中）。但是，如果您正在使用JSON序列化（这是一个相当常见的事情），请了解数组实例是以仅涉及数字命名属性的方式序列化为JSON。添加到数组的其他属性永远不会出现在序列化的JSON表单中。例如：

var obj = [];
obj[0] = "hello world";
obj["something"] = 5000;

var objJSON = JSON.stringify(obj);

“objJSON”的值将是仅包含["hello world"]的字符串; “某物”财产将会丢失。

ES2015：

如果您能够使用ES6 JavaScript功能，则可以使用Computed Property Names轻松处理此问题：

var key = 'DYNAMIC_KEY',
    obj = {
        [key]: 'ES6!'
    };

console.log(obj);
// > { 'DYNAMIC_KEY': 'ES6!' }

Answer 2

JavaScript中的关联数组与其他语言的关联数据并不一样。 for each语句很复杂（因为它们枚举了继承的原型属性）。您可以像Pointy提到的那样在对象/关联数组上声明属性，但实际上对于这类事情，您应该使用带有push方法的数组：

jsArr = []; 

for (var i = 1; i <= 10; i++) { 
    jsArr.push('example ' + 1); 
}

不要忘记索引数组是从零开始的，所以第一个元素是jsArr [0]，而不是jsArr [1]。

如何创建要添加到JavaScript对象变量的动态密钥

2 个答案:

ES2015：