为什么 JSON.parse(JSON.stringify) 无法完美深拷贝？

在 JavaScript 开发中，使用 JSON.parse(JSON.stringify(obj)) 复制对象是许多人最早接触的深拷贝写法。这种方法利用了“先把对象转为 JSON 文本，再将文本重新解析为全新对象”的特性来切断原始引用。然而，这种技巧无法称作真正的“完美深拷贝”。其根本原因在于：JSON 是一套独立于语言的文本数据交换格式，它只支持基础标量类型的极小子集，并不具备表达 JavaScript 丰富运行时内存模型的能力。在序列化与反序列化的闭环中，它会产生静默属性丢失、类型降级退化、特殊数值篡改，甚至在遭遇循环引用与 BigInt 时直接抛错崩溃。

图 0：JSON.parse(JSON.stringify) 深拷贝漏斗模型与数据漏损全貌

图 1：JSON.parse(JSON.stringify) 执行阶段与数据处理流水线

const source = {
  name: "Antigravity",
  action: function() { console.log("running"); },
  extra: undefined,
  symValue: Symbol("secret"),
  [Symbol("key")]: "symbolKeyContent",
  list: [1, undefined, function() {}, Symbol("arr"), 5]
};

const copy = JSON.parse(JSON.stringify(source));
console.log(copy);

{
  name: "Antigravity",
  list: [1, null, null, null, 5]
}
// 注意：action、extra、symValue 属性完全消失；
// Symbol 属性名 [Symbol("key")] 直接被跳过；
// list 数组项中的 undefined、函数与 Symbol 被强行篡改为 null。

const metrics = {
  score: NaN,
  maxLimit: Infinity,
  minLimit: -Infinity,
  normal: 100
};

const clonedMetrics = JSON.parse(JSON.stringify(metrics));
console.log(clonedMetrics);

{
  score: null,
  maxLimit: null,
  minLimit: null,
  normal: 100
}
// 原本用于指示计算溢出或无效状态的数值，反序列化后沦为普通的 null。

const complexData = {
  createTime: new Date("2026-10-31T08:00:00Z"),
  validator: /^[a-z]+$/gi,
  tags: new Set(["frontend", "javascript"]),
  cache: new Map([["key1", "val1"]])
};

const copy = JSON.parse(JSON.stringify(complexData));
console.log("createTime 类型:", typeof copy.createTime, "值:", copy.createTime);
console.log("validator:", copy.validator);
console.log("tags:", copy.tags);
console.log("cache:", copy.cache);

createTime 类型: string 值: 2026-10-31T08:00:00.000Z
validator: {}
tags: {}
cache: {}
// 结论：Date 变为了 string，正则表达式与集合数据全部置空！

图 2：JavaScript 数据类型在 JSON 序列化中的失真分类矩阵

const parent = { title: "RootNode" };
const child = { name: "ChildNode", parentRef: parent };
parent.childRef = child; // 构成循环引用：parent -> child -> parent

try {
  JSON.parse(JSON.stringify(parent));
} catch (err) {
  console.error("捕获到致命异常:", err.message);
}

捕获到致命异常: Converting circular structure to JSON
    --> starting at object with constructor 'Object'
    |     property 'childRef' -> object with constructor 'Object'
    --- property 'parentRef' closes the circle

图 3：循环引用检测机制与序列化递归死锁防线

const origin = {
  date: new Date(),
  pattern: /^[0-9]+$/g,
  map: new Map([["status", "active"]]),
  set: new Set([1, 2, 3]),
  scores: [98, 100]
};
// 构造自引用
origin.self = origin;

// 原生深拷贝
const copy = structuredClone(origin);

console.log(copy.date instanceof Date); // 输出: true (保留Date原型)
console.log(copy.map.get("status"));    // 输出: "active" (保留Map)
console.log(copy.self === copy);        // 输出: true (完美还原循环引用关系)

尽管功能强大，structuredClone() 依旧不支持克隆函数（遇到 Function 会抛出 DataCloneError）、不支持 DOM 节点克隆，并且同样不会保留自定义类的原型链。

function deepClone(target, hash = new WeakMap()) {
  // 1. 处理 null 或基本标量类型
  if (target === null || typeof target !== "object") {
    return target;
  }

  // 2. 检查循环引用：若已存在映射，直接返回对应副本
  if (hash.has(target)) {
    return hash.get(target);
  }

  // 3. 处理 Date 与 RegExp 特殊实例
  if (target instanceof Date) return new Date(target);
  if (target instanceof RegExp) return new RegExp(target.source, target.flags);

  // 4. 处理 Map 与 Set
  if (target instanceof Set) {
    const resultSet = new Set();
    hash.set(target, resultSet);
    target.forEach(val => resultSet.add(deepClone(val, hash)));
    return resultSet;
  }
  if (target instanceof Map) {
    const resultMap = new Map();
    hash.set(target, resultMap);
    target.forEach((val, key) => resultMap.set(deepClone(key, hash), deepClone(val, hash)));
    return resultMap;
  }

  // 5. 保持原型链，创建新对象或数组
  const cloneTarget = Array.isArray(target)
    ? []
    : Object.create(Object.getPrototypeOf(target));

  // 记录到 WeakMap 中，防止循环嵌套死锁
  hash.set(target, cloneTarget);

  // 6. 递归遍历包含 Symbol 在内的所有自身可枚举属性
  const keys = Reflect.ownKeys(target);
  for (const key of keys) {
    const desc = Object.getOwnPropertyDescriptor(target, key);
    if (desc && desc.enumerable) {
      cloneTarget[key] = deepClone(target[key], hash);
    }
  }

  return cloneTarget;
}

图 4：JavaScript 深拷贝技术选型决策树与能力全景矩阵