如何在JavaScript中比较两个对象数组，匹配时为对象添加键值对

需求场景 #

我有两个对象数组：

let paymentType = [
  {id: "settle", set: "dis_10"},
  {id: "settle1", set: "dis_20"},
  {id: "settle2", set: "dis_30"},
]

let result = [
  {id: "settle", type: 40},
  {id: "settle4", type: 50},
  {id: "settle2", type: 60},
]

需要实现：当两个数组中的id匹配时，将paymentType中的set属性添加到result的对应对象中，最终得到如下结果：

let result = [
  {id: "settle", type: 40, set: "dis_10"},
  {id: "settle4", type: 50},
  {id: "settle2", type: 60},
]

之前尝试用filter和some方法，没得到预期效果。

高效解决方案 #

推荐先将paymentType转换为以id为键的Map，把查找匹配项的时间复杂度降到O(1)，再遍历result数组完成属性合并：

// 将paymentType转为Map，键是id，值是对应的set属性
const paymentMap = new Map(paymentType.map(item => [item.id, item.set]));

// 遍历result数组，合并匹配的set属性
const updatedResult = result.map(item => {
  const setValue = paymentMap.get(item.id);
  // 找到匹配项就合并属性，否则返回原对象
  return setValue ? {...item, set: setValue} : item;
});

console.log(updatedResult);

关于filter和some的问题说明 #

filter的作用是过滤数组元素，而我们需要的是修改数组内对象的属性，不是筛选元素；some仅用于判断是否存在匹配项，无法直接帮我们添加属性。如果一定要用这两个方法实现，写法会繁琐且效率较低（每次遍历都要多次扫描paymentType数组）：

const updatedResult = result.map(item => {
  // 先判断是否存在匹配的id
  const hasMatch = paymentType.some(payment => payment.id === item.id);
  if (hasMatch) {
    // 找到匹配的对象并合并属性
    const matchedItem = paymentType.find(payment => payment.id === item.id);
    return {...item, set: matchedItem.set};
  }
  return item;
});

这种写法在数组元素较多时，性能会明显不如Map方案。

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