javascript如何深度拷贝对象_有哪些实现方式-js教程-PHP中文网

javascript如何深度拷贝对象_有哪些实现方式

幻影之瞳

发布： 2025-12-17 15:09:36

原创

680人浏览过

JavaScript深度拷贝核心是递归复制所有嵌套层级值以避免引用共享；常用方案包括JSON.parse+JSON.stringify（简洁但局限多）、structuredClone（现代标准，支持丰富类型但不兼容旧环境）、手写递归（兼容性强可定制）、Lodash cloneDeep（生产推荐，覆盖全面）。

javascript如何深度拷贝对象_有哪些实现方式

JavaScript 深度拷贝对象，核心是**递归复制所有嵌套层级的值**，避免引用共享。原生没有直接支持深拷贝的 API（Object.assign 和展开运算符都只是浅拷贝），所以需要手动实现或借助可靠方案。

JSON.parse + JSON.stringify（最简但有局限）

适用于纯数据对象：只含字符串、数字、布尔、null、数组、普通对象，且不含函数、undefined、Symbol、Date、RegExp、Map、Set、循环引用等。

✅ 优点：一行代码，无依赖，性能快
❌ 缺点：会丢失函数、undefined、Symbol；Date 变成字符串；NaN 变成 null；无法处理循环引用；正则变成空对象

示例：
const deepCopy = obj => JSON.parse(JSON.stringify(obj));

结构化克隆（structuredClone，现代推荐）

Chrome 98+、Firefox 94+、Node.js 17.0+ 支持，是目前最接近“标准深拷贝”的原生方案。

✅ 优点：支持 Map、Set、Date、RegExp、ArrayBuffer、TypedArray、Error、Blob 等；能处理循环引用；语义准确
❌ 缺点：不支持函数、undefined、Symbol（同 JSON）；旧浏览器和低版本 Node 不可用

示例：
const copy = structuredClone(originalObj);

Text Mark

处理文本内容的AI助手

113

查看详情

手写递归深拷贝（兼容性最强）

适合需要完全可控、兼容老环境（如 IE）、或需定制行为（如忽略某些字段、处理特殊类型）的场景。

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

需判断类型（用 Object.prototype.toString.call 或 typeof + Array.isArray）
用 WeakMap 记录已拷贝对象，解决循环引用
对 Date、RegExp、Map、Set 等内置类型做单独处理
普通对象/数组递归遍历属性并深拷贝

简化版示意（不含循环引用处理）：

function deepClone(obj) {<br>  if (obj === null || typeof obj !== 'object') return obj;<br>  if (obj instanceof Date) return new Date(obj);<br>  if (obj instanceof RegExp) return new RegExp(obj);<br>  const clone = Array.isArray(obj) ? [] : {};<br>  for (let key in obj) {<br>    if (obj.hasOwnProperty(key)) {<br>      clone[key] = deepClone(obj[key]);<br>    }<br>  }<br>  return clone;<br>}

登录后复制