如何将数组中具有相同a值的元素合并至同一索引？

需求说明 #

原始数组：

[
  {a: "b"},
  {a: "b"},
  {a: "c"},
  {a: "c"},
]

需要将相同a值的元素合并到同一索引，最终得到：

[
  {
    a: "b",
    a1: "b"
  },
  {
    a: "c",
    a1: "c"
  },
]

实现思路 #

1. 先以a字段的值为键，对原始数组进行分组，把相同a值的元素归为一组；
2. 遍历每个分组，将组内的两个元素转换为包含a和a1的对象；
3. 收集所有处理后的对象，得到最终数组。

代码实现（固定每组2个元素场景） #

const originalArray = [
  {a: "b"},
  {a: "b"},
  {a: "c"},
  {a: "c"},
];

// 按a值分组
const grouped = originalArray.reduce((acc, curr) => {
  const key = curr.a;
  acc[key] = acc[key] || [];
  acc[key].push(curr);
  return acc;
}, {});

// 转换为目标结构
const mergedArray = Object.values(grouped).map(group => ({
  a: group[0].a,
  a1: group[1].a
}));

console.log(mergedArray);

扩展方案（适配任意数量同值元素） #

如果同a值的元素数量不固定，可以动态生成字段名（如a、a1、a2...），代码如下：

const mergedArray = Object.values(grouped).map(group => {
  return group.reduce((obj, item, idx) => {
    obj[idx === 0 ? 'a' : `a${idx}`] = item.a;
    return obj;
  }, {});
});

比如3个{a: "b"}会被合并为{a: "b", a1: "b", a2: "b"}。

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