structuredclone不支持循环引用，会抛出datacloneerror；它遵循html标准，仅线性序列化，不维护引用图谱，适用于无循环的深嵌套对象克隆。
structuredClone 本身不支持循环引用——它会直接抛出 DATA_CLONE_ERR 错误，根本不会“崩溃”，但也不会成功克隆。所谓“完美解决”是误解；你需要先确认：你真需要 structuredClone 吗？还是其实该换方案？
为什么 structuredClone 一遇到循环引用就报错
structuredClone 遵循 HTML 标准的结构化克隆算法，该算法明确禁止循环引用（即对象 A 引用 B，B 又引用回 A 或 A 自身）。这不是 bug，是设计使然——它不维护引用图谱，只做线性序列化。
常见错误现象：
- 调用
structuredClone(obj)时抛出DOMException: Failed to execute 'structuredClone' on 'Window': An object could not be cloned. - 错误堆栈里看不到具体哪一层循环，只有顶层失败提示
使用场景中容易踩坑的是：状态管理（如 Redux devtools 快照）、WebSocket 消息缓存、或从 postMessage 接收的跨上下文对象——这些地方看似“深层嵌套”，实则暗藏 parent/children、root/node.parent 等双向引用。
替代方案：手写循环安全的深克隆函数（轻量级）
如果你必须保留循环引用关系（比如克隆一个树形结构并维持父子双向指针），structuredClone 不适用，得用带引用映射的手动遍历。以下是一个最小可行实现：
function deepCloneWithCycles(obj, map = new WeakMap()) {
if (obj === null || typeof obj !== 'object') return obj;
if (map.has(obj)) return map.get(obj);
const clone = Array.isArray(obj) ? [] : {};
map.set(obj, clone);
for (const key in obj) {
if (Object.prototype.hasOwnProperty.call(obj, key)) {
clone[key] = deepCloneWithCycles(obj[key], map);
}
}
return clone;
}
关键点：
-
WeakMap存原始对象 → 克隆后对象的映射，避免内存泄漏 - 不依赖
JSON.stringify，可处理Date、RegExp、undefined（但不处理Function、Symbol、Map/Set等，需按需扩展） - 性能上比
structuredClone慢，但可控；对万级节点树，实测延迟在毫秒级
什么时候仍可坚持用 structuredClone？
如果你的数据源本身**不包含循环引用**，只是嵌套深、体积大，那 structuredClone 是最优解——它快、原生、能处理 ArrayBuffer、TypedArray、Map、Set、Date、RegExp 等。
验证是否含循环引用的方法：
- 临时用
console.log(JSON.stringify(obj))—— 若报Converting circular structure to JSON，说明有循环 - 更准的方式：用上面的
deepCloneWithCycles尝试克隆，不报错即无循环；或用try { structuredClone(obj) } catch快速探活 - 注意：某些框架（如 Vue 响应式代理）会在对象上挂
__v_skip或__ob__，这些属性可能引入隐式循环，需提前delete或structuredClone前剥离
真正麻烦的从来不是“怎么克隆”，而是“你到底要不要保留引用关系”。如果克隆后对象要独立修改且不影响原数据，循环引用本身就不该存在；如果必须保留（比如调试器里还原运行时对象图），那就得接受手写逻辑的复杂度——structuredClone 的边界，就是它的设计边界。
