JavaScript如何实现数据的深拷贝、浅拷贝？

原文合集地址如下，有需要的朋友可以关注

本文地址

什么是深浅拷贝

说到深浅拷贝就得提起JavaScript中的数据类型之前的文章中有介绍过，这里就不再细说了。
浅拷贝：对基本数据类型进行值复制,对引用数据类型复制引用地址。浅拷贝会创建一个新对象,这个对象有着原始对象属性值的一份精确拷贝。如果拷贝的是像对象这样的引用对象,那么浅拷贝会复制引用指向堆内存地址,因此源对象和拷贝对象会共享属性。
深拷贝：对基本数据类型进行值复制,对引用数据类型递归复制。深拷贝会另外创造一个一摸一样的对象,新对象跟原对象不共享内存,修改新对象不会改到原对象。
区别举例:

// 原始对象
let obj = {a: 1,b: {c: 2}
}// 浅拷贝
let shallowCopy = Object.assign({}, obj) // 深拷贝
let deepCopy = JSON.parse(JSON.stringify(obj))obj.b.c = 3
console.log(shallowCopy.b.c) // 3
console.log(deepCopy.b.c) // 2

如何实现

在 JavaScript 中，拷贝操作用于复制对象或数组的值，以便在不影响原始对象的情况下进行操作。拷贝分为深拷贝和浅拷贝两种类型。

浅拷贝（Shallow Copy）：

常见的浅拷贝方式包括：

扩展操作符（Spread Operator）：
使用 ... 操作符进行浅拷贝。

const originalArray = [1, 2, 3];
const shallowCopy = [...originalArray];

Object.assign() 方法：
使用 Object.assign() 方法将属性从一个或多个源对象复制到目标对象。
```
const originalObj = { a: 1, b: 2 };
const shallowCopy = Object.assign({}, originalObj);
```

深拷贝（Deep Copy）：

深拷贝创建了一个新对象，并递归地复制原始对象的所有属性及其嵌套属性，确保每个引用类型都是独立的新对象，不会与原始对象共享。

常见的深拷贝方式包括：

使用递归：
递归遍历对象的所有属性，并在遇到引用类型时继续递归。

function deepCopy(obj) {if (typeof obj !== 'object' || obj === null) {return obj;}const copy = Array.isArray(obj) ? [] : {};for (const key in obj) {if (obj.hasOwnProperty(key)) {copy[key] = deepCopy(obj[key]);}}return copy;
}

JSON 序列化与反序列化：
通过先将对象转换为 JSON 字符串，然后再将其解析回对象，实现深拷贝。但这种方法有一些限制，不能复制函数、正则表达式等。
```
const originalObj = { a: 1, nested: { b: 2 } };
const deepCopy = JSON.parse(JSON.stringify(originalObj));
```

需要注意什么问题

在使用拷贝操作时，有一些重要的注意事项需要考虑，特别是在处理复杂的对象和数据结构时。以下是需要注意的几点：

引用类型：
拷贝操作通常在处理引用类型（如对象和数组）时更为复杂。浅拷贝可能只复制引用，而深拷贝可能导致性能问题。理解被拷贝对象中的引用关系是很重要的。
循环引用：
如果要拷贝的对象中存在循环引用（即对象 A 引用了对象 B，而对象 B 又引用了对象 A），那么简单的拷贝操作可能会导致无限递归或栈溢出。在实现深拷贝时，需要考虑如何处理循环引用。
性能考虑：
深拷贝可能在处理大型对象或嵌套深度很深的结构时变得很慢，因为它需要递归地复制每个属性。在这些情况下，可能需要选择性地使用浅拷贝或者其他优化方法。
不可拷贝属性：
一些对象的属性是不可枚举或不可拷贝的（例如原型链上的属性）。在拷贝操作中，这些属性可能被忽略。
函数和特殊对象：
函数和一些特殊的对象（如正则表达式、Date 对象等）可能需要特殊的处理，特别是在使用深拷贝时。这些对象可能无法通过 JSON 序列化来实现深拷贝。
性能和内存开销：
拷贝操作可能导致性能问题和额外的内存开销，特别是在处理大数据结构时。在做出选择时，需要权衡性能和内存使用。