JavaScript Object.assign()

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

// combine all the properties of
// obj1, obj2, obj3 into a single object 
const mergedObj = Object.assign(obj1, obj2, obj3);

console.log(mergedObj); 

// Output: { a: 1, b: 2, c: 3 }

assign() 语法

assign() 方法的语法是：

Object.assign(target, ...sources)

这里，assign() 是一个静态方法。因此，我们需要使用类名 Object 来访问该方法。

assign() 参数

assign() 方法接受：

• target - 我们将从中复制 sources 所有属性的目标对象。
• sources - 我们希望复制其属性的源对象。

assign() 返回值

assign() 方法返回 target 对象。

注意：如果 target 对象中的属性与 sources 中的属性具有相同的键，则 sources 中的属性会覆盖 target 中的属性。

示例 1：Javascript Object.assign() 克隆对象

// create source object
const obj = {
  name: "Alan Turing",
  age: 20,
};

// create target object
let newObject = {};

// copy enumerable properties of obj to newObject
// newObject is returned and stored in copy object
const copy = Object.assign(newObject, obj);

// print the copy object
console.log(copy);

// Output: { name: 'Alan Turing', age: 20 }

// print newObject
console.log(newObject);

// Output: { name: 'Alan Turing', age: 20 }

在上面的示例中，我们使用 assign() 方法将 obj 的内容分配给 newObject。

由于 assign() 修改目标对象并返回同一对象，因此 copy 和 newObject 彼此都是克隆。因此，当我们打印两者时，会得到相同的输出。

示例 2：assign() 合并对象

// source objects
const o1 = { a: 1, b: 2, c: 3 };
const o2 = { b: 12, c: 13 };
const o3 = { c: 23 };

// merge o1, o2, and o3
// earlier source keys are overwritten by later sources
const o4 = Object.assign({}, o1, o2, o3);

console.log(o4); 

// Output: { a: 1, b: 12, c: 23 }

在上面的示例中，我们使用 assign() 将对象 o1、o2 和 o3 合并到一个新对象 o4 中。

const o4 = Object.assign({}, o1, o2, o3);

使用空对象 {} 作为目标对象可确保其他对象的属性被复制到一个新对象，而不会修改任何源对象。

从输出可以看出，后续对象的属性会覆盖先前对象的属性。例如，

• o1 中的 b 键被 o2 中的对应键覆盖。
• o1 和 o2 中的 c 键被 o3 中的对应键覆盖。

注意：如果源值是对对象的引用，它只会复制引用值。

另请阅读

• JavaScript Object.defineProperties()
• JavaScript Object.keys()
• JavaScript Object.values()