JavaScript中如何将指定结构数组转换为字典？是否存在优雅的实现方式（例如使用map）？

你当前的for循环实现完全可行，但确实有更简洁优雅的函数式写法——Array.prototype.reduce() 是处理这类聚合分组场景的绝佳工具，代码更紧凑且可读性拉满。

先明确下你的需求场景：

将如下结构的数组：

[ 
  {id: 1, from: "1/1/2021", to: "1/2/2022"}, 
  {id: 2, from: "1/3/2021", to: "1/4/2022"}, 
  {id: 1, from: "1/5/2021", to: "1/6/2022"}, 
  {id: 2, from: "1/6/2021", to: "1/7/2022"} 
]

转换为按ID分组的字典结构：

{ 
  1: [{from: "1/1/2021", to: "1/2/2022"}, {from: "1/5/2021", to: "1/6/2022"}], 
  2: [{from: "1/3/2021", to: "1/4/2022"}, {from: "1/6/2021", to: "1/7/2022"}] 
}

用reduce实现的优雅版本 #

const res = [ 
  {id: 1, from: "1/1/2021", to: "1/2/2022"}, 
  {id: 2, from: "1/3/2021", to: "1/4/2022"}, 
  {id: 1, from: "1/5/2021", to: "1/6/2022"}, 
  {id: 2, from: "1/6/2021", to: "1/7/2022"} 
];

const dict = res.reduce((acc, curr) => {
  // 初始化当前ID对应的数组（如果不存在的话）
  acc[curr.id] = acc[curr.id] || [];
  // 推入当前项的from和to字段
  acc[curr.id].push({ from: curr.from, to: curr.to });
  // 返回累积对象，供下一次迭代使用
  return acc;
}, {}); // 初始累积值设为空对象

console.log(dict);

再简化一步：用解构和空值合并运算符 #

如果想让代码更凝练，可以结合对象解构和ES2020的空值合并运算符??：

const dict = res.reduce((acc, { id, from, to }) => {
  acc[id] = acc[id] ?? [];
  acc[id].push({ from, to });
  return acc;
}, {});

为什么不用map？ #

这里要说明下：map的核心作用是将数组的每一项映射为新项，最终返回的还是一个数组；而我们需要的是将数组聚合为单个对象，reduce才是专门处理这种“累积聚合”场景的API，它可以把数组转化为任意类型的单个值（对象、数字、数组等）。

另外补充下：你原有的for循环其实性能很好，在某些场景下甚至比reduce略快，但reduce的函数式写法更贴合现代JS风格，代码简洁易维护。

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