JS如何比对数组内对象的list属性并合并list完全相同的元素

代码问题分析 #

• 不必要的异步逻辑：你所有的对象对比操作都是同步计算，不需要加async/await，而reduce的回调如果是async函数，每次返回的是Promise实例，而非累加的结果数组，导致后续的累加操作全部异常。
• 没有对reduce的返回值做处理：即使硬要用异步reduce，也需要用.then()或者顶层await拿最终结果，你当前的写法直接执行reduce是拿不到正确数组的。
• （可选问题）当前的对比逻辑是按索引严格比对list元素，如果你的业务场景允许list元素顺序不同但内容相同就算一致，这个判断逻辑需要调整。

正确实现代码 #

版本1：要求list元素顺序完全一致才判定为相同 #

// 对比两个对象是否完全相等
const objectsEqual = (o1, o2) =>
  Object.keys(o1).length === Object.keys(o2).length &&
  Object.keys(o1).every(p => o1[p] === o2[p]);

// 对比两个list数组是否完全一致
const listsEqual = (arr1, arr2) =>
  arr1.length === arr2.length && arr1.every((el, i) => objectsEqual(el, arr2[i]));

const result = array.reduce((acc, item) => {
  // 查找累加数组中是否存在相同list的项
  const matchedItem = acc.find(accItem => listsEqual(accItem.list, item.list));
  if (matchedItem) {
    matchedItem.group = `${matchedItem.group},${item.group}`;
  } else {
    // 浅拷贝item避免修改原数组，有深层修改需求可替换为深拷贝逻辑
    acc.push({...item});
  }
  return acc;
}, []);

版本2：list元素顺序不同但内容相同也判定为相同 #

只需修改listsEqual的实现即可：

const listsEqual = (arr1, arr2) => {
  if (arr1.length !== arr2.length) return false;
  // 按key排序后再对比
  const sortByKey = arr => [...arr].sort((a, b) => a.key.localeCompare(b.key));
  const sorted1 = sortByKey(arr1);
  const sorted2 = sortByKey(arr2);
  return sorted1.every((el, i) => objectsEqual(el, sorted2[i]));
};

执行后result就是你需要的目标结果。

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