文章目录
深拷贝的特点
深拷贝创建了一个全新的对象，并递归复制原对象内部的所有属性和嵌套对象。这意味着新对象与原对象完全独立，修改新对象不会影响到原对象。具体特点如下：
- 独立性：深拷贝后的新对象与其原型之间没有任何关联，即对新对象的任何操作都不会反映在原对象上。
- 完整复制：不仅复制对象本身，还会递归地复制对象中的所有子对象、数组等复杂结构。
- 性能开销：由于需要遍历整个对象树并为每个节点创建副本，深拷贝可能比浅拷贝消耗更多的时间和内存资源。
- 处理复杂数据类型：能够正确处理函数、日期对象、正则表达式、
Map、Set等复杂的数据类型（取决于实现方式）。 - 循环引用支持：通过使用
WeakMap或Map来追踪已复制的对象，可以有效地处理循环引用问题，避免无限递归。
实现深拷贝的方法
1. 使用 JSON 方法
这种方法简单易用，但有明显的局限性：
- 不能处理函数：因为函数在序列化时会被忽略。
- 不支持特殊对象：如
Date、RegExp、Map、Set等对象无法被正确复制。 - 循环引用会导致错误：JSON 序列化过程中遇到循环引用会抛出异常。
const originalObject = { a: 1, b: { c: 2 } };
const deepCopy = JSON.parse(JSON.stringify(originalObject));
2. 使用 lodash 库
lodash 的 cloneDeep 方法更加全面，能够处理更多的数据类型，并且内置了对循环引用的支持。然而，这要求项目中引入外部库。
const _ = require('lodash');
const originalObject = { a: 1, b: { c: 2 } };
const deepCopy = _.cloneDeep(originalObject);
3. 手动实现
编写递归函数来手动实现深拷贝，这种方式虽然较为繁琐，但可以自定义拷贝行为，能够处理各种特殊情况。例如：
function isObject(item) {
return (item && typeof item === 'object' && !Array.isArray(item));
}
function deepClone(source, hash = new WeakMap()) {
if (!isObject(source)) return source;
// Handle circular references
if (hash.has(source)) return hash.get(source);
let clone = Array.isArray(source) ? [] : {};
hash.set(source, clone);
Object.keys(source).forEach(key => {
if (isObject(source[key])) {
clone[key] = deepClone(source[key], hash);
} else {
clone[key] = source[key];
}
});
return clone;
}
4. 结构化克隆算法
某些浏览器环境（如 Web Workers API）支持结构化克隆算法，它可以处理比 JSON 方法更多的数据类型，但仍有一些限制，比如不支持函数。
深拷贝与循环引用
当对象中存在循环引用时，简单的深拷贝会导致无限递归问题。为了避免这种情况，可以在复制过程中使用 WeakMap 或 Map 来跟踪已经复制过的对象，从而避免重复复制同一个对象。上面提供的手动实现方法就是一个很好的例子，它通过 WeakMap 来追踪已复制的对象，从而有效地解决了循环引用的问题。
性能评估
评估深拷贝的性能可以从以下几个方面考虑：
- 时间复杂度：深拷贝的时间复杂度通常与要复制的对象结构大小成正比。对于大型或复杂的对象结构，所需的时间可能会显著增加。
- 空间复杂度：深拷贝创建了全新的对象副本，因此它也会占用额外的内存空间。对于非常大的对象，这可能是一个重要的考虑因素。
- 数据类型的支持：不同的深拷贝实现对不同类型的数据支持程度不同，比如函数、日期对象、正则表达式等，不恰当的处理可能会导致性能问题。
- 循环引用的处理：处理循环引用增加了逻辑上的复杂性，可能会影响性能。使用
WeakMap或Map来追踪已复制的对象可以有效提高效率。
可以通过测试工具如 console.time() 和 console.timeEnd() 来测量代码执行时间，也可以使用浏览器提供的性能分析工具来进行更详细的分析。此外，还可以利用基准测试框架（如 Benchmark.js）来量化性能差异。
解决对象引用问题的其他方法
除了深拷贝之外，还有多种方式可以解决对象的引用问题：
- 浅拷贝：只复制对象的第一层属性，不递归复制内部对象。适用于不需要完整独立副本的情况。JavaScript 提供了多种浅拷贝的方式，如
Object.assign、扩展运算符 (...) 和Array.prototype.slice。 - 不可变模式：采用不可变的数据结构或编程模式，如 React 和 Redux 中使用的那样，保证每次更新都创建新的对象而不是修改现有对象。这可以借助 Immutable.js 这样的库来简化实现。
- 防御性拷贝：根据需求选择性地复制特定部分，而非整个对象。这样可以在保持性能的同时解决部分引用问题。
- 值类型传递：尽可能使用简单类型（如数字、字符串），因为它们是按值传递的，不存在引用问题。这种方式适用于那些不需要复杂数据结构的场景。
- Proxy 或 Getter/Setter：使用 JavaScript 的 Proxy 对象或自定义 getter/setter 来拦截并控制对象访问，间接管理引用问题。这种方式适合于需要细粒度控制对象访问权限或行为的场合。
- 库辅助：使用专门设计用于管理不可变数据结构的库（如 Immutable.js）。这些库提供了高效的不可变数据操作，可以帮助开发者更容易地处理复杂的数据结构而不必担心副作用。
每种方法都有其适用场景和技术限制，选择哪种方法应根据具体需求、项目背景以及技术栈来决定。对于复杂的对象结构或需要高效处理的情况，考虑使用成熟的第三方库可能是更好的选择，因为这些库往往已经优化了性能并解决了常见的边界情况。
手动实现深拷贝处理循环引用
下面是一个更加详细的示例，展示了如何使用 WeakMap 来防止深拷贝过程中的循环引用问题。这个例子还包含了对几种常见复杂类型的处理：
function deepClone(obj, hash = new WeakMap()) {
// 如果不是对象或者为null，直接返回
if (obj === null || typeof obj !== 'object') return obj;
// 如果对象已经被复制过，直接返回之前的副本
if (hash.has(obj)) return hash.get(obj);
// 创建一个新的实例，针对不同的构造函数做处理
let cloneObj;
if (obj instanceof Date) {
cloneObj = new Date(obj);
} else if (obj instanceof RegExp) {
cloneObj = new RegExp(obj);
} else if (Array.isArray(obj)) {
cloneObj = [];
} else {
cloneObj = Object.create(Object.getPrototypeOf(obj));
}
// 将原对象和它的副本存入哈希表，防止循环引用
hash.set(obj, cloneObj);
// 遍历对象的每一个键值对，递归进行深拷贝
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
cloneObj[key] = deepClone(obj[key], hash);
}
}
// 返回最终的副本
return cloneObj;
}