如何用 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(不可访问): 文小言 百度旗下新搜索智能助手,有问题,问小言。

相关推荐
程序员塔塔喵1 分钟前
【MySQL篇|第七篇】MySQL事务
数据库·mysql·mysql事务
在世修行32 分钟前
智学文枢:页面切换与跨页数据预填
python·桌面应用·signal·1024程序员节·pyside·跨页跳转·状态预填
2601_962885721 小时前
如何用 Python 把 K 线重采样成任意周期?
开发语言·python
独隅1 小时前
Claude API 实战教程:从入门到完整项目
android·java·数据库·claude·claude code
打工仔折腾 AI1 小时前
在 Ubuntu ARM64 部署 Q1 V3.0 MuJoCo 模型:加载、单步推理与执行器响应解析
linux·运维·人工智能·python·深度学习·ubuntu·性能优化
_孤傲_1 小时前
快速掌握 MySQL 语法
数据库·后端·mysql
信誓旦旦的程序猿2 小时前
【Python量化实战宝典 #21】北向资金跟随手册:聪明钱择时信号(Python 可跑)
python·1024程序员节·股票数据api·股票数据api接口·股票api数据接口·股票量化数据api·股票量化数据接口
严谨的麻辣烫2 小时前
静态 ISP 代理请求超时怎么排查?Python 与 curl 实战
python·http·requests·1024程序员节·网络排障
数字新视界3 小时前
一体化机柜在数据中心运维中的创新应用与优势分析
大数据·服务器·数据库·动环监控系统·动力与环境监控系统
SelectDB3 小时前
从 StarRocks 走向 Apache Doris:如何实现引擎平滑替换与架构升级?
大数据·数据库·数据分析