JavaScript 对象复制的深入详解：浅拷贝与深拷贝267

在 JavaScript 开发中，对象复制是一个非常常见的操作。理解如何正确地复制对象对于编写高效且无 bug 的代码至关重要。然而，JavaScript 中的对象复制并非简单地“赋值”就能完成，它包含了浅拷贝和深拷贝两种不同的策略，它们在复制对象的机制和结果上存在显著差异。本文将深入探讨 JavaScript 中对象复制的各种方法，并详细解释浅拷贝和深拷贝的区别，帮助大家选择合适的复制方法。

一、对象赋值的误区：浅拷贝的陷阱

许多 JavaScript 新手可能会尝试使用简单的赋值操作符 `=` 来复制对象：
let obj1 = { a: 1, b: { c: 2 } };
let obj2 = obj1; // 赋值操作
obj2.a = 3;
(obj1.a); // 输出 3 obj1 也被修改了！
obj2.b.c = 4;
(obj1.b.c); // 输出 4 obj1.b 也被修改了！

这段代码表面上看起来是将 `obj1` 复制给了 `obj2`，但实际上，`obj2` 仅仅是 `obj1` 的一个引用。它们指向的是内存中的同一个对象。修改 `obj2` 的属性，也会影响到 `obj1`。这就是所谓的浅拷贝。浅拷贝只复制对象的顶层属性，而不会复制嵌套对象或数组。对于嵌套对象，浅拷贝只复制它们的引用，因此修改嵌套对象的属性也会影响到原始对象。

二、浅拷贝的方法

虽然简单的赋值属于浅拷贝，但还有其他几种方法可以实现浅拷贝，例如：
`()` 方法：该方法可以将一个或多个源对象的属性复制到目标对象。如果源对象中的属性与目标对象中的属性同名，则源对象的属性会覆盖目标对象的属性。

let obj1 = { a: 1, b: { c: 2 } };
let obj2 = ({}, obj1); // 创建一个空对象作为目标对象
obj2.a = 3;
(obj1.a); // 输出 1
obj2.b.c = 4;
(obj1.b.c); // 输出 4 (因为b是引用类型)

扩展运算符 (`...`)：扩展运算符可以将对象的属性展开到一个新的对象中，实现浅拷贝。

let obj1 = { a: 1, b: { c: 2 } };
let obj2 = { ...obj1 };
obj2.a = 3;
(obj1.a); // 输出 1
obj2.b.c = 4;
(obj1.b.c); // 输出 4 (因为b是引用类型)

`slice()` 方法 (用于数组): 对于数组，可以使用 `slice()` 方法创建数组的浅拷贝。

let arr1 = [1, 2, [3, 4]];
let arr2 = ();
arr2[0] = 5;
(arr1[0]); // 输出 1
arr2[2][0] = 6;
(arr1[2][0]); // 输出 6 (因为嵌套数组是引用类型)

需要注意的是，以上所有浅拷贝方法在处理嵌套对象时，仍然只复制引用，而非创建新的对象副本。

三、深拷贝的方法

深拷贝会递归地复制对象的所有属性，包括嵌套对象和数组。修改深拷贝后的对象不会影响原始对象。实现深拷贝的方法相对复杂，常用的方法包括：
使用递归函数：这是一种比较直接的方法，但需要自行编写递归函数来处理不同数据类型的属性。

function deepCopy(obj) {
if (typeof obj !== "object" || obj === null) {
return obj;
}
let copy = (obj) ? [] : {};
for (let key in obj) {
if ((key)) {
copy[key] = deepCopy(obj[key]);
}
}
return copy;
}
let obj1 = { a: 1, b: { c: 2 } };
let obj2 = deepCopy(obj1);
obj2.a = 3;
obj2.b.c = 4;
(obj1.a); // 输出 1
(obj1.b.c); // 输出 2

`((obj))` 方法：这种方法简单易懂，但存在局限性。它只能复制可序列化的数据类型，例如数字、字符串、布尔值、数组和对象。不能复制函数、日期对象等非可序列化对象，并且会丢失原型链上的信息。

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

第三方库：像 Lodash 这样的第三方库提供了 `cloneDeep` 方法，可以更可靠地进行深拷贝，处理更多复杂的数据结构。这对于大型项目而言是更稳妥的选择。