structuredclone 可实现安全深拷贝,原生支持 map、set、date 等复杂类型且避免循环引用错误;基础封装捕获 domexception 并提示,增强版支持 transfer 零拷贝转移 arraybuffer,兼容性方案需降级处理。

直接用 structuredClone 就能实现一个安全、深拷贝的高阶函数,它原生支持 Map、Set、Date、RegExp、ArrayBuffer 等复杂类型,且不触发循环引用错误(会抛出明确异常),比 JSON 序列化更健壮。
基础封装:支持默认行为 + 错误处理
最简实现只需包装原生 API,并统一错误提示:
- 捕获
DOMException(如循环引用、不可克隆对象)并给出可读提示 - 返回值保持与输入一致的类型,不额外包裹或转换
- 不添加多余参数,避免干扰原语义
try {
return structuredClone(value);
} catch (err) {
if (err instanceof DOMException && err.name === 'DataCloneError') {
throw new TypeError(`无法克隆该值:${err.message}`);
}
throw err;
}
}
增强能力:支持自定义克隆逻辑(通过 transfer)
structuredClone 支持 transfer 选项,适用于 ArrayBuffer 及其视图(如 Uint8Array),可实现零拷贝转移:
- 只对二进制数据生效,普通对象传
transfer会报错 - 转移后原 buffer 变为 detached,需确保后续不再访问
- 适合大文件、音视频数据等性能敏感场景
return structuredClone(value, { transfer });
}
兼容性兜底:检测并降级到替代方案
在不支持 structuredClone 的环境(如旧版 Node.js 或 Safari
- 检查
typeof structuredClone === 'function' - 降级方案优先选
JSON.parse(JSON.stringify())(仅限纯 JSON 数据) - 更严谨的降级可用第三方库如
lodash.cloneDeep,但需权衡体积
if (typeof structuredClone === 'function') {
return structuredClone(value);
}
// 降级逻辑...
return JSON.parse(JSON.stringify(value));
}
使用注意:哪些值不能被克隆
structuredClone 明确不支持以下类型,调用会抛 DataCloneError:
- 函数(
Function)、undefined、Symbol - DOM 节点、
window、document等宿主对象 - 带有循环引用的对象或嵌套结构
- 某些特殊内置对象(如
Error实例,部分浏览器仍不支持)
实际使用前建议先校验输入类型,或在外层 try/catch 中处理边界情况。











