Javascript对象合并

一、浅合并（只合并第一层属性）

1. Object.assign()（不会递归合并）

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };const merged = Object.assign({}, obj1, obj2);
console.log(merged); // { a: 1, b: 3, c: 4 }

• 后面的对象属性会覆盖前面的。

• 不修改原始对象（如果第一个参数是空对象 {}）。

2. 展开运算符 …

const merged = { ...obj1, ...obj2 };

效果同 Object.assign，更简洁。

二、深合并（递归合并多层对象）

浅合并只处理第一层属性，如果属性值是对象，不会递归合并：

const obj1 = { a: 1, b: { x: 1 } };
const obj2 = { b: { y: 2 }, c: 3 };// 浅合并
const merged = { ...obj1, ...obj2 };
console.log(merged); // { a: 1, b: { y: 2 }, c: 3 }，丢失了 b.x

实现一个简单的深合并函数：

function deepMerge(target, source) {const result = { ...target };for (const key in source) {if (source[key] instanceof Object &&key in target &&target[key] instanceof Object) {result[key] = deepMerge(target[key], source[key]);} else {result[key] = source[key];}}return result;
}// 示例
const obj1 = { a: 1, b: { x: 1 } };
const obj2 = { b: { y: 2 }, c: 3 };const merged = deepMerge(obj1, obj2);
console.log(merged); // { a: 1, b: { x: 1, y: 2 }, c: 3 }

三、使用库：lodash 的 _.merge

如果你项目中已经用到了 lodash，推荐直接使用：

import _ from 'lodash';const merged = _.merge({}, obj1, obj2);

支持深合并且可靠、处理边界情况多。

总结

方法	是否递归	是否修改原对象	特点
Object.assign()	否	否（如传空对象）	简单、浅合并
... 展开符号	否	否	更简洁、浅合并
自定义 deepMerge	是	否	灵活、可控
lodash.merge	是	否	稳定、推荐在项目中使用