JS深拷贝浅拷贝怎么区分_JS深拷贝与浅拷贝原理与实现方法-js教程-PHP中文网

JS深拷贝浅拷贝怎么区分_JS深拷贝与浅拷贝原理与实现方法

蓮花仙者

发布： 2025-11-07 13:45:03

原创

783人浏览过

浅拷贝只复制对象第一层属性，引用类型共享内存，修改嵌套属性会影响原对象；深拷贝递归复制所有层级，生成完全独立的对象。常见浅拷贝方法有Object.assign()、展开运算符；深拷贝可用JSON.parse(JSON.stringify())或递归实现，后者可处理函数、循环引用等复杂情况。

js深拷贝浅拷贝怎么区分_js深拷贝与浅拷贝原理与实现方法

在JavaScript中，深拷贝和浅拷贝都是用来复制对象的方法，但它们的行为有本质区别。理解两者的原理和实现方式，对处理复杂数据结构非常重要。

什么是浅拷贝？

浅拷贝是指创建一个新对象，这个新对象拥有原对象属性的直接值或引用。如果原对象的属性是基本类型，拷贝的是值；如果是引用类型（如数组、对象），拷贝的是内存地址，也就是说，新旧对象会共享同一块堆内存。

这意味着：修改拷贝后的对象中的引用类型属性，会影响原始对象。

常见实现方式：

Object.assign()：只能实现一级属性的浅拷贝
展开运算符 {...obj}：同上，只复制第一层
Array.prototype.slice() 或 concat()：适用于数组浅拷贝

示例：

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

登录后复制

什么是深拷贝？

深拷贝会递归地复制对象的所有层级，包括嵌套的对象和数组，生成一个完全独立的新对象。原对象和拷贝对象互不影响。

深拷贝的关键在于：所有引用类型都被重新创建，不共享任何内存。

Reclaim.ai

为优先事项创建完美的时间表

查看详情

常见实现方式：

JSON.parse(JSON.stringify(obj))：简单有效，但有局限性（不能处理函数、undefined、Symbol、循环引用等）
递归手动实现：可以控制各种数据类型，更灵活
使用第三方库：如 Lodash 的 _.cloneDeep()

示例（JSON方法）：

const obj1 = { a: 1, b: { c: 2 } };
const obj2 = JSON.parse(JSON.stringify(obj1));
obj2.b.c = 3;
console.log(obj1.b.c); // 输出 2，互不影响

登录后复制

注意：JSON方法无法处理函数、正则、Date对象可能出错、以及循环引用会报错。

如何手动实现一个简易深拷贝？

通过递归判断数据类型，分别处理对象、数组和其他类型。

function deepClone(obj, visited = new WeakMap()) {
  if (obj === null || typeof obj !== 'object') return obj;
  
  // 处理循环引用
  if (visited.has(obj)) return visited.get(obj);
  
  let clone;
  if (Array.isArray(obj)) {
    clone = [];
  } else {
    clone = {};
  }
  
  visited.set(obj, clone);

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

登录后复制

这个版本支持循环引用（使用WeakMap），避免无限递归。