JS 合并两个包含嵌套子对象的对象的最佳实现方案

你需要的是对象深合并能力，核心逻辑是合并嵌套层级的属性，而非直接覆盖顶层重名属性，下面是两种常用的实现方案：

1. 原生JS手动实现（无第三方依赖） #

自己写递归方法即可满足基础需求，核心逻辑是：如果两个对象的重名属性都是纯对象，则递归合并内部属性，否则直接用第二个对象的属性值覆盖第一个的对应属性。

function deepMerge(target, source) {
  // 遍历源对象所有自有属性
  for (const key in source) {
    if (Object.prototype.hasOwnProperty.call(source, key)) {
      const targetVal = target[key];
      const sourceVal = source[key];
      // 两个属性都是纯对象时递归合并
      const isPureObj = val => typeof val === 'object' && val !== null && !Array.isArray(val);
      if (isPureObj(targetVal) && isPureObj(sourceVal)) {
        target[key] = deepMerge(targetVal, sourceVal);
      } else {
        // 非对象属性直接赋值，源对象优先级更高
        target[key] = sourceVal;
      }
    }
  }
  return target;
}

测试你的场景示例：

const obj1 = {
  subType: {
    type: {
      name: { contains: "e" }
    }
  }
};
const obj2 = {
  subType: {
    name: { contains: "A" }
  }
};
// 传入空对象作为初始目标，避免修改原对象
const mergedResult = deepMerge(deepMerge({}, obj1), obj2);
console.log(mergedResult);

输出结果完全匹配你的预期：

{
  subType: {
    type: { name: { contains: "e" } },
    name: { contains: "A" }
  }
}

注意：以上简单实现默认不处理数组、循环引用、特殊类型对象等边界场景，有对应需求可以自行扩展判断逻辑

2. 生产环境推荐方案 #

如果项目允许引入第三方工具库，直接使用成熟的深合并方法即可，已经处理了所有常见边界情况：

• Lodash的_.merge方法，逻辑和你的需求完全匹配：

const _ = require('lodash');
const mergedResult = _.merge({}, obj1, obj2);

特别提醒：不要使用原生Object.assign或者展开运算符...实现该需求，二者都是浅合并，只会直接覆盖顶层的subType属性，无法合并内部嵌套属性。

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