什么是javascript深拷贝_如何实现对象的完全复制

幻影之瞳 2025-12-23 00:00:00 次阅读

JavaScript深拷贝是创建完全独立的新对象，递归复制所有嵌套属性；浅拷贝仅复制第一层，嵌套对象仍共享引用；常用方法包括JSON序列化（有局限）、structuredClone（推荐）、递归实现和lodash.cloneDeep。

JavaScript深拷贝是指创建一个新对象，该对象与原对象完全独立，修改新对象不会影响原对象，且其所有嵌套属性（包括对象、数组、日期、正则等）也都被递归复制，而非共享引用。

为什么浅拷贝不行

使用Object.assign()、展开运算符{...obj}或Array.from()等方式只能实现浅拷贝——只复制第一层属性。一旦对象内部还有对象或数组，它们的引用仍会被共享。

例如：const a = { user: { name: 'Alice' } }; const b = { ...a }; b.user.name = 'Bob'; → 此时a.user.name也会变成'Bob'
根本原因是：嵌套的user对象在a和b中指向同一内存地址

常用深拷贝方法及适用场景

没有一种方法完美适用于所有情况，需按数据结构和需求选择：

JSON.parse(JSON.stringify(obj))：最简单，但会丢失函数、undefined、Symbol、Date、RegExp、Map、Set、循环引用，且NaN转为null
structuredClone()（现代浏览器支持）：原生API，支持Map、Set、Date、RegExp、ArrayBuffer等，能处理循环引用（Chrome 98+、Firefox 94+、Safari 15.4+），推荐优先使用
递归实现基础版：适合学习原理或定制逻辑（如过滤某些字段、处理特殊类型），但需手动处理Date、RegExp、ArrayBuffer等
第三方库（如lodash.cloneDeep）：健壮全面，兼容性好，适合生产环境复杂对象

手写简易深拷贝（支持常见类型）

以下是一个兼顾可读性和实用性的基础实现，覆盖对象、数组、Date、RegExp、基本类型：

function deepClone(obj) {
  if (obj === null || typeof obj !== 'object') return obj;

  if (obj instanceof Date) return new Date(obj);
  if (obj instanceof RegExp) return new RegExp(obj);

  const cloned = Array.isArray(obj) ? [] : {};
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      cloned[key] = deepClone(obj[key]);
    }
  }
  return cloned;
}