JavaScript中如何将值数组转换为键值对对象数组？

当然有简便方法啦！我来给你分享几种实用的实现方式，刚好匹配你提到的《Interactive Data Visualization for the Web》（第二版）里的场景～

最简洁的方案：使用Array.map() #

JavaScript的Array.map()方法简直是为这种场景量身定做的——它会遍历数组的每个元素，同时能获取到元素的索引，刚好可以用来生成你需要的key和value键值对：

const dataset = [5, 10, 13];
const transformedDataset = dataset.map((value, index) => ({
  key: index,
  value: value
}));

console.log(transformedDataset);
// 输出结果：
// [ { key: 0, value: 5 }, { key: 1, value: 10 }, { key: 2, value: 13 } ]

代码解释：

• map()的回调函数接收两个参数：第一个是当前遍历到的元素（作为value），第二个是元素的索引（作为key）
• 箭头函数后面用小括号包裹对象字面量，避免JavaScript把大括号当成函数体，这样可以直接返回目标对象

兼容ES5的写法 #

如果你的运行环境不支持ES6箭头函数，也可以用普通函数实现，效果完全一样：

var dataset = [5, 10, 13];
var transformedDataset = dataset.map(function(value, index) {
  return {
    key: index,
    value: value
  };
});

这种方法既简洁又符合函数式编程的思路，在数据可视化场景中非常常用，刚好能满足书中“Data Join with Keys”章节的需求——我之前处理类似问题时也用这个方案，亲测高效好用～

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