如何用 structuredClone 原生函数实现复杂对象深拷贝

structuredClone 是浏览器原生深拷贝方法,支持 Map、Set、Date、RegExp、ArrayBuffer 等复杂类型及循环引用,不支持函数、Promise、WeakMap 等;可通过 transfer 选项高效转移 ArrayBuffer 内存;Chrome 98+、Firefox 97+、Safari 15.4+ 原生支持,旧环境可降级为 JSON 方案或 postMessage polyfill。structuredClone 是浏览器原生提供的深拷贝方法,能安全、高效地复制包含函数以外的大多数复杂对象(如 Map、Set、Date、RegExp、ArrayBuffer、TypedArray、Error、DOM 节点等),且自动处理循环引用,无需手动递归或第三方库。支持的数据类型与限制structuredClone 支持以下类型:普通对象、数组、Map、SetDate、RegExp、Error(拷贝后保持原型和属性)ArrayBuffer、DataView、所有 TypedArray(如 Uint8Array)BigInt、Boolean、String、Number、Symbol(仅限可序列化的 Symbol,如 Symbol.for('key'))嵌套结构和循环引用(自动识别并正确重建)不支持:函数、Promise、WeakMap、WeakSet、window、document、undefined、不可枚举属性(如某些 DOM 属性)、带有 getter/setter 的对象属性(其值不会被调用,getter 不执行)。基本用法:一行完成深拷贝直接传入源对象即可,返回一个完全独立的新对象:const original = { name: "Alice", hobbies: "reading", "coding", meta: new Map(\["age", 30]), created: new Date(), buffer: new Uint8Array(1, 2, 3)};<p>const clone = structuredClone(original);console.log(clone.meta === original.meta); // falseconsole.log(clone.created.getTime() === original.created.getTime()); // true(值相同,实例不同)处理 Transferable 对象(高级用法)当拷贝 ArrayBuffer 或 TypedArray 时,可通过 transfer 选项将底层内存"转移"而非复制,提升性能(尤其对大数组)。转移后原对象对应 buffer 变为 detached(不可访问): 文小言 百度旗下新搜索智能助手,有问题,问小言。

相关推荐
OceanRoy7 小时前
数据库表的设计
数据库·内连接·外连接·er图·表的约束·三大范式·多表连接
Pniubi8 小时前
怎么排查慢SQL,怎么解决?
java·数据库·sql
M--Y8 小时前
LangGraph 工作流模式
开发语言·javascript·python·langchain·大模型·llm·langgraph
岁月宁静9 小时前
DeepSeek Harness 实战与架构解析:让 Agent 从“会聊”到“能交付”
人工智能·python·agent
LiaoWL1239 小时前
NumPy 入门实战(二):向量化与余弦相似度——从 ndarray 到 Embedding
python·numpy·embedding
薛之谦_9 小时前
Java 全栈知识体系:从 IDEA 高效开发到 JVM、并发与 Stream 实战
java·jvm·intellij-idea
forest_099 小时前
多 Agent 协作第二课:交叉验证≠独立验证
人工智能·python·算法·机器学习·prompt·agi
Decay__12 小时前
VMware 安装 SQL Server 双节点 AlwaysOn 可用性组教程 —— WSFC、AG 与侦听器完整部署(系列核心篇)
运维·数据库·sql·mysql·架构
databook12 小时前
时间序列数据,先拆规律还是先查异常
python·数据挖掘·数据分析
茶栀(*´I`*)13 小时前
SQL 性能分析:从慢查询日志到执行计划的完整定位方法
数据库·sql