Object.assign 是一个 JavaScript 方法，用于将一个或多个源对象的所有可枚举属性复制到目标对象中。它返回目标对象。这个方法常用于合并对象或浅复制对象。
语法
Object.assign(target, ...sources)
target: 目标对象。sources: 一个或多个源对象。
示例
1. 合并对象
将多个对象的属性合并到一个对象中。
const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
const result = Object.assign(target, source1, source2);
console.log(result); // { a: 1, b: 2, c: 3 }
console.log(target); // { a: 1, b: 2, c: 3 }
为什么【const result = Object.assign(target, source1, source2);】里面的result和target的值都是一样的？
这是因为 Object.assign 会将所有源对象的属性复制到目标对象，并且返回的也是这个目标对象。所以，result 和 target 实际上是同一个对象的引用，它们会具有相同的值。更具体地说，Object.assign 是一个“浅拷贝”，它只拷贝对象的自身属性（不包括原型链上的属性），并且是按顺序进行的，所以后面的源对象的属性会覆盖前面的源对象的同名属性。
以下是一个详细的例子和解释：
示例代码
const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
const result = Object.assign(target, source1, source2);
console.log(result); // { a: 1, b: 2, c: 3 }
console.log(target); // { a: 1, b: 2, c: 3 }
解释
初始对象：
target: { a: 1 }source1: { b: 2 }source2: { c: 3 }
执行
Object.assign(target, source1, source2)：- 首先将
source1的属性复制到target:target变成{ a: 1, b: 2 }
- 然后将
source2的属性复制到target:target变成{ a: 1, b: 2, c: 3 }
- 首先将
返回值：
Object.assign返回的对象就是target，所以result和target都是指向同一个对象，它们的值完全相同。
深入理解
当你执行 Object.assign 时，它会修改 target 对象，并且返回这个修改后的对象。因此，result 和 target 实际上是同一个对象的引用，修改 result 也会修改 target，反之亦然。
在浏览器控制台中试试
你可以在浏览器的控制台中输入以下代码来验证：
const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
const result = Object.assign(target, source1, source2);
console.log('result:', result); // { a: 1, b: 2, c: 3 }
console.log('target:', target); // { a: 1, b: 2, c: 3 }
console.log(result === target); // true, 说明 result 和 target 是同一个对象的引用
通过这些代码，你可以观察到 result 和 target 的值是相同的，并且它们是同一个对象的引用。
2. 浅拷贝对象
创建对象的浅拷贝。
const obj = { a: 1, b: { c: 2 } };
const copy = Object.assign({}, obj);
console.log(copy); // { a: 1, b: { c: 2 } }
// 修改原对象不会影响拷贝对象（对于顶层属性）
obj.a = 10;
console.log(copy.a); // 1
// 但是对于嵌套对象（浅拷贝），修改会反映在拷贝对象上
obj.b.c = 20;
console.log(copy.b.c); // 20
3. 添加新属性
可以使用 Object.assign 给对象添加新属性。
const target = { a: 1 };
const result = Object.assign(target, { b: 2, c: 3 });
console.log(result); // { a: 1, b: 2, c: 3 }
console.log(target); // { a: 1, b: 2, c: 3 }
4. 重写属性
如果源对象有与目标对象同名的属性，目标对象的属性将被源对象的属性覆盖。
const target = { a: 1, b: 2 };
const source = { b: 3, c: 4 };
const result = Object.assign(target, source);
console.log(result); // { a: 1, b: 3, c: 4 }
console.log(target); // { a: 1, b: 3, c: 4 }
在浏览器控制台中试试
在浏览器的控制台中，输入以下代码并查看输出结果：
const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
const result = Object.assign(target, source1, source2);
console.log('合并后的对象:', result);
console.log('目标对象:', target);
const obj = { a: 1, b: { c: 2 } };
const copy = Object.assign({}, obj);
console.log('浅拷贝后的对象:', copy);
// 修改原对象不会影响拷贝对象（对于顶层属性）
obj.a = 10;
console.log('修改原对象顶层属性后的拷贝对象:', copy.a);
// 但是对于嵌套对象（浅拷贝），修改会反映在拷贝对象上
obj.b.c = 20;
console.log('修改原对象嵌套属性后的拷贝对象:', copy.b.c);
你会看到合并后的对象、浅拷贝对象以及修改后的输出结果。
