在JavaScript中，可以使用Object.assign()方法或展开语法（…）来合并对象

飞熊 • 2023年12月19日下午8:51 • Vue • 阅读 208

在JavaScript中，你可以使用Object.assign()方法或者使用Spread Operator (…) 来合并对象。

Object.assign()

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

语法

Object.assign(target, ...sources)

参数

target：需要应用源对象属性的目标对象，修改后将作为返回值。
sources：一个或多个包含要应用的属性的源对象。

示例

let name = { name:'sea' },age = { age:15 },person= {}

Object.assign(person,name,age)

console.log(person) 
//{ name:'sea',age:15 }

在这个例子中，Object.assign()方法创建了一个新的对象，其属性是所有传入对象的属性的拷贝。

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
// Expected output: Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget === target);
// Expected output: true

如果目标对象与源对象具有相同的键（属性名），则目标对象中的属性将被源对象中的属性覆盖，后面的源对象的属性将类似地覆盖前面的源对象的同名属性。

展开语法Spread Operator (…)

浅拷贝 (Shallow-cloning，不包含 prototype) 和对象合并，可以使用更简短的展开语法。而不必再使用 Object.assign() 方式。

Spread运算符也可以用来合并对象。它可以将一个数组或对象展开到一个函数或数组中。

let name = { name:'sea' },age = { age:15 }

let person = { ...name,...age }

console.log(person)
//{ name:'sea',age:15 }

在这个例子中，Spread Operator (…) 用于扩展对象，所以它复制了所有对象的属性到新的对象中。

var obj1 = { foo: "bar", x: 42 };
var obj2 = { foo: "baz", y: 13 };

var clonedObj = { ...obj1 };
// 克隆后的对象：{ foo: "bar", x: 42 }

var mergedObj = { ...obj1, ...obj2 };
// 合并后的对象：{ foo: "baz", x: 42, y: 13 }