对象拷贝：深拷贝与浅拷贝实现方案-js教程-PHP中文网

对象拷贝：深拷贝与浅拷贝实现方案

夢幻星辰

发布： 2025-11-19 20:57:24

原创

113人浏览过

浅拷贝只复制对象第一层属性，嵌套对象共享引用，修改会影响原对象；深拷贝递归复制所有层级，生成完全独立副本。常用浅拷贝方法有Object.assign、扩展运算符；深拷贝可用JSON.parse(JSON.stringify())、递归实现或Lodash的cloneDeep。

对象拷贝：深拷贝与浅拷贝实现方案

在JavaScript中，对象拷贝是一个常见需求。根据是否复制对象内部引用的数据，分为浅拷贝和深拷贝。理解两者的区别并掌握实现方式，对开发至关重要。

浅拷贝：只复制第一层属性

浅拷贝创建一个新对象，将原对象的可枚举属性复制过来，但如果属性值是引用类型（如对象或数组），则只复制引用地址，不会递归复制其内容。这意味着修改嵌套对象会影响原对象。

常见的浅拷贝方法包括：

Object.assign()：将多个源对象合并到目标对象
扩展运算符（...）：语法简洁，适合日常使用
for...in 循环手动赋值：兼容性好，可控性强

示例：

const obj = { a: 1, b: { c: 2 } };
const copy = { ...obj };
copy.b.c = 3;
console.log(obj.b.c); // 输出 3，说明共享引用

登录后复制

深拷贝：完全独立的副本

深拷贝会递归复制对象的所有层级，生成一个与原对象完全独立的新对象。修改拷贝后的对象不会影响原始对象。

GAIPPT

AI PPT制作和美化神器

1129

查看详情

实现深拷贝有多种方案，各有优劣：

JSON.parse(JSON.stringify(obj))：简单快捷，但有明显限制，比如不支持函数、undefined、Symbol、循环引用等
递归实现：手动遍历对象属性，对引用类型继续调用深拷贝函数，能处理大多数情况
结构化克隆算法（Structured Clone）：浏览器原生支持，可通过MessageChannel或postMessage实现，比JSON更强大
第三方库（如 Lodash）：提供成熟的 _.cloneDeep 方法，兼容性好，功能全面

简易递归深拷贝示例：

function deepClone(obj, seen = new WeakMap()) {
  if (obj === null || typeof obj !== 'object') return obj;
  if (seen.has(obj)) return seen.get(obj); // 处理循环引用

  const clone = Array.isArray(obj) ? [] : {};
  seen.set(obj, clone);

  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      clone[key] = deepClone(obj[key], seen);
    }
  }
  return clone;
}

登录后复制