一、深拷贝与浅拷贝的本质差异

在JavaScript中，数据类型分为原始类型（Number、String、Boolean等）和引用类型（Object、Array、Function等）。浅拷贝仅复制引用地址，导致新旧对象共享同一内存空间，修改其中一个会影响另一个。例如：

const original = { a: 1, b: { c: 2 } };
const shallowCopy = { ...original };
shallowCopy.b.c = 3;
console.log(original.b.c); // 输出3，原对象被修改

深拷贝的核心在于完全复制所有层级的数据结构，包括嵌套对象和特殊类型（如Date、RegExp、Map等），确保新旧对象完全独立。这是解决循环引用、共享引用等问题的关键技术。

二、手写深拷贝的实现逻辑

1. 基础实现框架

function deepClone(obj, hash = new WeakMap()) {
  // 处理基本类型和null/undefined
  if (obj === null || typeof obj !== 'object') {
    return obj;
  }
  // 处理循环引用
  if (hash.has(obj)) {
    return hash.get(obj);
  }
  // 处理特殊对象类型
  const constructor = obj.constructor;
  switch (constructor) {
    case Date: return new Date(obj);
    case RegExp: return new RegExp(obj);
    // 其他特殊类型处理...
  }
  // 创建新对象
  const cloneObj = new constructor();
  hash.set(obj, cloneObj); // 记录已复制对象
  // 递归复制属性
  for (const key in obj) {
    if (obj.hasOwnProperty(key)) {
      cloneObj[key] = deepClone(obj[key], hash);
    }
  }
  // 处理Symbol属性
  const symbolKeys = Object.getOwnPropertySymbols(obj);
  for (const symKey of symbolKeys) {
    cloneObj[symKey] = deepClone(obj[symKey], hash);
  }
  return cloneObj;
}

2. 关键实现细节

（1）循环引用处理

通过WeakMap记录已复制对象，当检测到重复引用时直接返回缓存对象：

const obj = { a: 1 };
obj.self = obj; // 循环引用
const cloned = deepClone(obj);
console.log(cloned.self === cloned); // true

（2）特殊对象类型处理

Date/RegExp：直接创建新实例

Map/Set：需要遍历元素重新添加

case Map:
const mapClone = new Map();
obj.forEach((value, key) => {
  mapClone.set(key, deepClone(value, hash));
});
return mapClone;

（3）函数处理策略

函数通常保持引用共享，但可通过toString()存储源码实现复制：

if (typeof obj === 'function') {
  return eval(`(${obj.toString()})`);
}

三、完整实现方案

1. 兼容性增强版

function deepClone(obj, hash = new WeakMap()) {
  // 处理基本类型
  if (obj === null || typeof obj !== 'object') return obj;
  // 处理循环引用
  if (hash.has(obj)) return hash.get(obj);
  // 处理DOM节点（根据需求可选）
  if (obj instanceof Node) return obj.cloneNode(true);
  // 类型判断与克隆
  let cloneObj;
  const constructor = obj.constructor;
  if (obj instanceof Date) {
    cloneObj = new Date(obj);
  } else if (obj instanceof RegExp) {
    cloneObj = new RegExp(obj.source, obj.flags);
  } else if (Array.isArray(obj)) {
    cloneObj = [];
    hash.set(obj, cloneObj);
    obj.forEach((item, index) => {
      cloneObj[index] = deepClone(item, hash);
    });
  } else if (obj instanceof Map) {
    cloneObj = new Map();
    hash.set(obj, cloneObj);
    obj.forEach((value, key) => {
      cloneObj.set(deepClone(key, hash), deepClone(value, hash));
    });
  } else if (obj instanceof Set) {
    cloneObj = new Set();
    hash.set(obj, cloneObj);
    obj.forEach(value => {
      cloneObj.add(deepClone(value, hash));
    });
  } else {
    // 普通对象
    cloneObj = Object.create(Object.getPrototypeOf(obj));
    hash.set(obj, cloneObj);
    const allKeys = [
      ...Object.keys(obj),
      ...Object.getOwnPropertySymbols(obj)
    ];
    allKeys.forEach(key => {
      cloneObj[key] = deepClone(obj[key], hash);
    });
  }
  return cloneObj;
}

2. 性能优化建议

缓存机制：使用WeakMap避免内存泄漏
类型预判：优先处理常见类型（Array/Date等）
非递归实现：对于深度嵌套结构，可改用栈结构实现迭代

四、实际应用场景

状态管理：在Redux/Vuex中复制状态防止意外修改
API响应处理：安全地修改后端返回的数据
不可变数据：实现React/Vue中的状态不可变性
序列化预处理：在存储前深度复制复杂对象

五、测试验证方案

// 测试用例1：嵌套对象
const original = { 
  date: new Date(), 
  arr: [1, { nested: 'value' }],
  map: new Map([['key', 'value']])
};
original.self = original;
const cloned = deepClone(original);
console.log(cloned !== original); // true
console.log(cloned.date instanceof Date); // true
console.log(cloned.self === cloned); // true
// 测试用例2：特殊对象
const regex = /test/g;
const regexClone = deepClone(regex);
console.log(regexClone.toString() === regex.toString()); // true

六、常见问题解决方案

原型链丢失：使用Object.create(Object.getPrototypeOf(obj))保持原型
不可枚举属性：通过Object.getOwnPropertyNames()获取所有属性
Symbol属性：使用Object.getOwnPropertySymbols()单独处理
Buffer对象：Node.js环境下需特殊处理Buffer.from(obj)

通过系统掌握上述实现逻辑，开发者可以构建出健壮的深拷贝工具，有效解决数据共享带来的副作用问题。实际开发中建议结合具体业务场景进行定制化调整，例如在前端框架中可简化DOM节点处理，在后端服务中需加强Buffer等二进制数据的支持。

手写深拷贝 DeepClone：原理剖析与实现指南