JavaScript中如何以数组元素作为对象属性键定义对象？

哦，这个问题我之前写代码的时候也踩过坑！你直接在对象字面量里写lastThreeYearsArr[0]当键的写法确实不生效——因为JS会把它当成普通的字符串字面量，而不是去求值数组对应的元素。不过有几种简单的方式可以解决：

方法1：使用ES6计算属性名（推荐） #

ES6新增的计算属性名特性允许你在对象字面量里用方括号包裹表达式，JS会先计算表达式的值，再把结果作为属性键。写法如下：

const currYear = new Date().getFullYear();
const lastThreeYearsArr = [currYear, currYear-1, currYear-2];

// 用方括号包裹数组元素表达式
const obj = {
  [lastThreeYearsArr[0]]: 0,
  [lastThreeYearsArr[1]]: 0,
  [lastThreeYearsArr[2]]: 0
};

这样obj的键就会是数组里对应的年份数字，而不是字符串"lastThreeYearsArr[0]"啦。

方法2：先创建空对象，再逐个赋值（兼容旧环境） #

如果你的代码需要兼容不支持ES6的旧环境，可以先初始化一个空对象，然后通过方括号访问语法逐个添加属性：

const currYear = new Date().getFullYear();
const lastThreeYearsArr = [currYear, currYear-1, currYear-2];

const obj = {};
// 用方括号语法赋值
obj[lastThreeYearsArr[0]] = 0;
obj[lastThreeYearsArr[1]] = 0;
obj[lastThreeYearsArr[2]] = 0;

方法3：用循环简化（适合数组元素较多的情况） #

如果数组里的元素不止3个，用循环会更简洁，比如forEach：

const currYear = new Date().getFullYear();
const lastThreeYearsArr = [currYear, currYear-1, currYear-2];

const obj = {};
lastThreeYearsArr.forEach(year => {
  obj[year] = 0;
});

这样不管数组长度怎么变，都不用手动修改赋值的代码，非常灵活。

内容的提问来源于stack exchange，提问作者Kim