JavaScript对比两个数组按id合并替换对象属性的实现方法

实现思路 #

• 首先将details数组转换为以id为键的哈希映射（Map结构），将查找匹配项的时间复杂度从O(n)降到O(1)，整体时间复杂度为O(m+n)（m为details长度，n为info长度），远优于嵌套循环的O(m*n)方案，数据量越大性能优势越明显
• 遍历info数组，对每个对象查询哈希映射：存在匹配id则合并两个对象（details的属性放在后面，自动覆盖同名属性），无匹配则直接保留原对象
• 采用对象展开语法实现合并，不会修改原数组的原有对象，避免副作用

实现代码 #

// 1. 构建id到details对象的映射
const detailMap = new Map(details.map(item => [item.id, item]))

// 2. 遍历info数组完成合并
const result = info.map(item => {
  const matchDetail = detailMap.get(item.id)
  // 匹配到则合并，detail在后覆盖同名属性，未匹配直接返回原对象浅拷贝
  return matchDetail ? {...item, ...matchDetail} : {...item}
})

如果可以接受修改原info数组的对象，也可以直接用Object.assign(item, matchDetail)，但通常不建议修改原始数据，避免引发其他逻辑的问题。

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