博客站

在JavaScript中，合并对象是一项常见的任务，可以通过多种方法来实现。以下是几种常用的方法：

1. 使用对象扩展运算符（Spread Operator）

对象扩展运算符...可以非常方便地将一个或多个对象的属性合并到一个新对象中。

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };

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

2. 使用 Object.assign()

Object.assign() 方法将一个或多个源对象的所有可枚举属性复制到目标对象中，并返回目标对象。

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };

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

3. 使用 Lodash 的 _.merge()

Lodash 是一个功能强大的实用程序库，提供了许多用于处理对象和集合的函数。_.merge() 方法可以深度合并对象。

const _ = require('lodash');

const obj1 = { a: 1, b: { x: 10 } };
const obj2 = { b: { y: 20 }, c: 4 };

const mergedObj = _.merge({}, obj1, obj2);
console.log(mergedObj); // { a: 1, b: { x: 10, y: 20 }, c: 4 }

4. 手动合并

手动遍历对象的属性并进行合并，适用于需要更细粒度控制的场景。

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };

const mergedObj = {};
for (let key in obj1) {
    if (obj1.hasOwnProperty(key)) {
        mergedObj[key] = obj1[key];
    }
}
for (let key in obj2) {
    if (obj2.hasOwnProperty(key)) {
        mergedObj[key] = obj2[key];
    }
}
console.log(mergedObj); // { a: 1, b: 3, c: 4 }

5. 使用 Object.keys() 和 reduce()

结合 Object.keys() 和 reduce() 方法，也可以实现对象的合并。

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };

const mergedObj = Object.keys({ ...obj1, ...obj2 }).reduce((acc, key) => {
    acc[key] = (obj2[key] !== undefined) ? obj2[key] : obj1[key];
    return acc;
}, {});
console.log(mergedObj); // { a: 1, b: 3, c: 4 }

注意事项

• 当属性名冲突时，后面的对象属性会覆盖前面的对象属性。
• 对于深度嵌套的对象，使用对象扩展运算符和 Object.assign() 方法只会进行浅拷贝，而 Lodash 的 _.merge() 方法可以进行深度合并。

选择哪种方法取决于具体的需求和场景。如果只是简单的对象合并，对象扩展运算符和 Object.assign() 是非常简洁和高效的选择。如果需要深度合并或更多控制，可以考虑使用 Lodash 或手动合并。