JavaScript在for循环中用迭代变量作对象键未获预期结果如何解决

问题原因 #

• JavaScript 中直接编写对象字面量时，未用特殊语法包裹的键名会被当作字符串字面量处理。你写的{ i: prices[i] }里的i不会被解析为循环变量的值，只会被识别为固定字符串"i"，这就是输出结果键名全是"i"的原因。

修复方法 #

使用ES6支持的计算属性名语法，用方括号包裹作为键的变量i，JS会先计算变量的实际值再将其设为对象的键，修改后的代码如下：

// prices is an array of numbers
function mapPrices(prices) {
  let newArray = [];
  for (let i = 0; i < prices.length; i++) {
    newArray.push({ [i]: prices[i] });
  }
  return newArray;
}

修改后调用mapPrices([1,2,3,4])即可得到预期输出[{0: 1}, {1: 2}, {2: 3}, {3: 4}]。

如果追求更简洁的写法，也可以直接用数组的map方法实现同等逻辑：

const mapPrices = prices => prices.map((value, index) => ({ [index]: value }))

内容的提问来源于stack exchange，提问作者Bad At Cpp