如何合并存在重复键的JavaScript对象并合并对应值

你遇到的问题是普通对象扩展运算符只会覆盖重复键的值，要实现自定义的合并逻辑（比如字符串拼接、嵌套对象合并），可以写一个递归的合并函数来处理：

function mergeObjects(obj1, obj2) {
  // 获取两个对象的所有唯一键
  const allKeys = new Set([...Object.keys(obj1), ...Object.keys(obj2)]);
  
  return Object.fromEntries(
    Array.from(allKeys).map(key => {
      const val1 = obj1[key];
      const val2 = obj2[key];
      
      // 处理嵌套对象的情况（递归合并）
      if (typeof val1 === 'object' && val1 !== null && typeof val2 === 'object' && val2 !== null) {
        return [key, mergeObjects(val1, val2)];
      }
      
      // 处理字符串拼接的情况
      if (typeof val1 === 'string' && typeof val2 === 'string') {
        return [key, `${val1} / ${val2}`];
      }
      
      // 其他情况：如果两个值类型不同/只有一个对象有该键，默认取obj2的值，或者自定义逻辑
      return [key, val2 ?? val1];
    })
  );
}

// 测试你的例子
const oldCar = {
  model: 'Honda',
  notes: {
    id: 1,
    timestamp: 2000,
    text: 'is old'
  }
}

const newCar = {
  model: 'Toyota',
  notes: {
    id: 1,
    timestamp: 4000,
    text: 'is new'
  }
}

const mergedCar = mergeObjects(oldCar, newCar);
console.log(mergedCar);

代码说明： #

• 获取所有键：用Set合并两个对象的键，确保不会遗漏任何一个对象的属性。
• 递归处理嵌套对象：如果两个键对应的值都是非空对象，就递归调用合并函数，处理嵌套的notes这类对象。
• 字符串拼接：如果两个值都是字符串，就按照a / b的格式拼接。
• 兜底逻辑：如果只有一个对象有该键，或者值类型不同，默认取第二个对象的值（如果不存在则取第一个），你可以根据需求修改这部分逻辑（比如数字类型也拼接、不同类型抛出提示等）。

运行后得到的mergedCar结果：

{
  model: 'Honda / Toyota',
  notes: {
    id: 1,
    timestamp: '2000 / 4000',
    text: 'is old / is new'
  }
}

如果你不需要处理嵌套对象，只需要合并顶层属性，可以简化函数去掉递归部分：

function mergeFlatObjects(obj1, obj2) {
  const allKeys = new Set([...Object.keys(obj1), ...Object.keys(obj2)]);
  return Object.fromEntries(
    Array.from(allKeys).map(key => {
      const val1 = obj1[key];
      const val2 = obj2[key];
      if (typeof val1 === 'string' && typeof val2 === 'string') {
        return [key, `${val1} / ${val2}`];
      }
      return [key, val2 ?? val1];
    })
  );
}

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