📜  javascript 合并对象 - Javascript (1)

📅  最后修改于: 2023-12-03 15:16:10.702000             🧑  作者: Mango

JavaScript 合并对象

有时候我们需要将两个或多个对象合并成一个对象以便更方便地操作它们。JavaScript 提供了几种方法可以合并对象。

Object.assign

Object.assign() 方法用于将一个或多个源对象的自身可枚举属性复制到目标对象中,然后返回目标对象。该方法修改目标对象并返回它,因此它不是一个深拷贝方法。

let target = { a: 1, b: 2 };
let source = { b: 3, c: 4 };
let result = Object.assign(target, source);
console.log(target); // { a: 1, b: 3, c: 4 }
console.log(result); // { a: 1, b: 3, c: 4 }, 与 target 相同

在上面的例子中,Object.assign() 首先将 source 对象的 b 属性的值复制到了 target 对象的同一属性中,然后将 source 对象的 c 属性添加到了 target 对象中。最后,Object.assign() 修改了 target 对象并返回了它。注意,Object.assign() 不会修改 source 对象。

如果源对象具有相同的属性,则其后的属性会覆盖前面的属性(从左到右)。另外,如果目标对象中的属性具有相同的属性,则也会发生覆盖。

Spread operator

JavaScript 的扩展运算符(spread operator)也可以用于合并对象。该运算符使用三个点 (...) 表示,用于展开可迭代对象,将它们解构成单独的部分。

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

在这个例子中,我们首先使用扩展运算符将 obj1obj2 解构成单独的部分,然后合并这些部分成一个新的对象 result。请注意,如果 obj1obj2 具有相同的属性,则最后一个对象的属性会覆盖前面的属性。

Lodash 的 merge

还有一个流行的 JavaScript 库 Lodash,提供了一个名为 merge 的函数可以用于合并对象。merge 方法执行深拷贝,以确保返回值是全新的。

const _ = require('lodash');
let obj1 = { a: { b: 1 } };
let obj2 = { a: { c: 2 } };
let result = _.merge({}, obj1, obj2);
console.log(result); // { a: { b: 1, c: 2 } }

在上面的例子中,我们首先使用 {} 创建了一个新对象,然后使用 _.merge()obj1obj2 合并成新对象 result。Lodash 使用深拷贝确保返回值是全新的,并将相同属性名的属性值合并为单个属性。

总结

本文介绍了 JavaScript 的三种合并对象的方法:Object.assign、Spread operator 和 Lodash 的 merge。每个方法都具有自己的优点和适用范围,您可以根据具体情况选择使用哪种方法。