JavaScript深浅拷贝实现_对象复制方案-js教程-PHP中文网

JavaScript深浅拷贝实现_对象复制方案

狼影

发布： 2025-11-29 20:55:35

原创

779人浏览过

深拷贝能完全复制对象及嵌套属性，避免引用共享；浅拷贝仅复制一级属性，嵌套对象仍共享内存。1. 浅拷贝用Object.assign或扩展运算符，无法隔离嵌套引用；2. 深拷贝可用JSON方法（限纯数据）或递归实现（支持Date、RegExp、循环引用等）；3. 实际推荐：简单场景用JSON，复杂类型用手写递归或Lodash的cloneDeep。

javascript深浅拷贝实现_对象复制方案

JavaScript中对象和数组的复制不是简单的赋值就能解决的，因为引用类型的数据存储的是地址，直接赋值会导致多个变量指向同一个内存空间。改变其中一个，其他变量也会受到影响。为了解决这个问题，就需要用到深拷贝和浅拷贝。

浅拷贝实现方式

浅拷贝是指创建一个新对象，这个对象有着原始对象属性的一级副本。如果属性是基本类型，拷贝的就是值；如果是引用类型，拷贝的则是内存地址。

常见实现方法：

Object.assign()：可将多个源对象的所有可枚举属性复制到目标对象
扩展运算符（...）：语法简洁，适用于对象和数组
手动遍历赋值：适合简单场景，逐个复制属性

示例：

const obj1 = { a: 1, b: { c: 2 } };
const obj2 = Object.assign({}, obj1);
// 或 const obj2 = { ...obj1 };

obj2.b.c = 3;
console.log(obj1.b.c); // 输出 3，说明b是引用共享

登录后复制

可见，浅拷贝无法处理嵌套对象的独立复制。

立即学习“Java免费学习笔记（深入）”；

深拷贝实现方式

深拷贝会递归地拷贝所有层级，确保新对象与原对象完全独立，互不影响。

常用方法包括：

JSON.stringify + JSON.parse：简单快捷，但有局限性
递归实现：可控性强，能处理复杂类型
借助第三方库（如 Lodash）：功能完整，兼容性好

方法一：JSON 方法（适用于纯数据对象）

AIBox 一站式AI创作平台

AIBox365一站式AI创作平台，支持ChatGPT、GPT4、Claue3、Gemini、Midjourney等国内外大模型

217

查看详情

const obj1 = { a: 1, b: { c: 2 } };
const obj2 = JSON.parse(JSON.stringify(obj1));

obj2.b.c = 3;
console.log(obj1.b.c); // 输出 2，成功隔离

登录后复制

限制：不能处理函数、undefined、Symbol、Date、RegExp 和循环引用。

方法二：手写递归深拷贝

function deepClone(target, map = new WeakMap()) {
  if (target === null || typeof target !== 'object') return target;

  // 处理日期
  if (target instanceof Date) return new Date(target);
  // 处理正则
  if (target instanceof RegExp) return new RegExp(target);

  // 防止循环引用
  if (map.has(target)) return map.get(target);

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

  for (let key in target) {
    if (Object.prototype.hasOwnProperty.call(target, key)) {
      clone[key] = deepClone(target[key], map);
    }
  }

  return clone;
}

登录后复制

这个版本支持对象、数组、Date、RegExp，并使用 WeakMap 避免循环引用问题。