js的深浅拷贝

深浅拷贝是编程中对数据复制的两种不同方式，它们在处理对象和数组等复合数据结构时尤为重要。下面将详细解释这两种拷贝方式。

浅拷贝（Shallow Copy）

浅拷贝创建了原始对象的一个新实例，但这个新实例的属性只是原始对象属性的引用。如果属性是基本数据类型（如数字、字符串、布尔值），那么它们会被复制；如果属性是引用类型（如对象、数组），则新对象的属性只是指向原始对象属性的引用。

特点：

• 创建新对象，但只复制第一层属性。
• 对于嵌套的对象或数组，新对象的属性与原始对象的属性指向相同的内存地址。
• 修改新对象的嵌套属性，会影响原始对象。

例子：

1. 使用 Object.assign()：

   let original = { a: 1, b: { c: 2 } };
   let shallow = Object.assign({}, original);
   shallow.b.c = 3; // 这会同时改变 original.b.c 的值
   

2. 使用扩展运算符：

   let original = [1, 2, { d: 4 }];
   let shallow = [...original];
   shallow[2].d = 5; // 这会同时改变 original[2].d 的值
   

3. 使用数组的 slice() 方法：

   let original = [1, 2, 3];
   let shallow = original.slice();
   shallow.push(4); // 这不会改变 original，因为数组是新的
   

深拷贝（Deep Copy）

深拷贝创建了原始对象的一个完全独立的副本，包括所有嵌套的对象和数组。修改新对象的任何属性都不会影响原始对象。

特点：

• 创建一个全新的对象，递归复制所有层级的属性。
• 对于嵌套的对象或数组，新对象的每个属性都是原始属性的独立副本。
• 修改新对象的任何属性，原始对象不受影响。

例子：

1. 使用递归函数：

   function deepCopy(obj) {if (typeof obj !== 'object' || obj === null) return obj;let clone = Array.isArray(obj) ? [] : {};for (let key in obj) {clone[key] = deepCopy(obj[key]);}return clone;
   }
   let original = { a: 1, b: { c: 2 } };
   let deep = deepCopy(original);
   deep.b.c = 3; // 这不会改变 original.b.c 的值
   

2. 使用 JSON.stringify() 和 JSON.parse()：

   let original = { a: 1, b: { c: 2 } };
   let deep = JSON.parse(JSON.stringify(original));
   deep.b.c = 3; // 这不会改变 original.b.c 的值
   

特殊情况

• 函数：深拷贝通常不会复制函数，因为 JSON.stringify() 会忽略函数。
• 特殊对象：如 Date, RegExp, Map, Set 等，在 JSON.stringify() 中不会被正确处理。
• 循环引用：JSON.stringify() 无法处理循环引用的对象，会导致错误。

例子 1：函数

let original = { name: 'Alice', greet: function() { console.log('Hello, ' + this.name); } };
let deepCopy = JSON.parse(JSON.stringify(original));deepCopy.greet(); // TypeError: deepCopy.greet is not a function

例子 2：循环引用

let original = {};
original.self = original;let deepCopy = JSON.parse(JSON.stringify(original));
console.log(deepCopy.self === original.self); // 输出: false

例子 3：特殊值

let original = { name: 'Alice', value: undefined };
let deepCopy = JSON.parse(JSON.stringify(original));console.log(deepCopy.value); // 输出: undefined

例子 4：正则表达式

let original = { name: 'Alice', pattern: /abc/ };
let deepCopy = JSON.parse(JSON.stringify(original));console.log(original.pattern.test('abc')); // 输出: true
console.log(deepCopy.pattern.test('abc')); // 输出: false

例子 5：Map 和 Set

let original = { name: 'Alice', map: new Map([['key', 'value']]), set: new Set([1, 2, 3]) };
let deepCopy = JSON.parse(JSON.stringify(original));console.log(original.map.get('key')); // 输出: value
console.log(deepCopy.map.get('key')); // 输出: undefined

区别

通过这些例子，你可以看到深浅拷贝在不同情况下的表现，以及它们在实际应用中的适用性和局限性。

深浅拷贝的区别主要体现在它们复制数据结构的方式和结果上。以下是深浅拷贝的主要区别：

1. 复制深度：

   • 浅拷贝：只复制了对象的第一层属性。如果对象的属性是引用类型（如数组或对象），浅拷贝只会复制引用，而不是实际的对象或数组。
   • 深拷贝：递归地复制了对象的所有层级，包括嵌套的对象或数组。每个属性都是原始属性的独立副本，不共享内存地址。

2. 内存地址：

   • 浅拷贝：新对象和原始对象共享一些引用类型的属性的内存地址。
   • 深拷贝：新对象和原始对象的所有属性都有独立的内存地址，互不影响。

3. 独立性：

   • 浅拷贝：新对象和原始对象不是完全独立的，修改新对象中引用类型的属性可能会影响原始对象。
   • 深拷贝：新对象和原始对象是完全独立的，对新对象的任何修改都不会影响到原始对象。

4. 性能：

   • 浅拷贝：通常比深拷贝更快，因为它只复制了对象的第一层属性。
   • 深拷贝：可能更慢，因为它需要递归地复制所有层级的属性。

5. 适用场景：

   • 浅拷贝：适用于只需要复制对象的第一层属性，或者对象中不包含复杂的嵌套引用。
   • 深拷贝：适用于需要完全独立的副本，特别是当对象包含多层嵌套的引用类型时。

6. 实现方式：

   • 浅拷贝：可以通过 Object.assign(), 扩展运算符（...）, Array.prototype.slice() 等方法实现。
   • 深拷贝：可以通过递归函数实现，或者使用 JSON.stringify() 和 JSON.parse()（但有局限性）。

7. 局限性：

   • 浅拷贝：无法处理循环引用，且不会复制函数和特殊对象（如 Date, RegExp, Map, Set 等）。
   • 深拷贝：使用 JSON.stringify() 和 JSON.parse() 时，无法处理函数、特殊对象和循环引用。

8. 副作用：

   • 浅拷贝：由于共享引用，修改新对象可能会产生意外的副作用，影响到原始对象。
   • 深拷贝：由于完全独立，修改新对象不会产生副作用。

理解这些区别对于在实际编程中选择合适的数据复制策略非常重要。选择不当可能会导致数据不一致或程序错误。

结论

深浅拷贝的选择取决于你需要复制的数据结构和预期的行为。如果你需要一个完全独立的副本，深拷贝是必要的。如果你只是需要复制第一层的属性，并且不关心嵌套对象的独立性，浅拷贝就足够了。然而，深拷贝也有其局限性，比如无法处理函数和特殊对象，以及循环引用的问题。在实际开发中，了解这些差异对于避免潜在的错误至关重要。