值得庆幸的是structuredClone在所有主流浏览器中都受支持,也支持 Node.js 和 Deno。 结语 我们现在终于可以直接使用原生 JavaScript 中的structuredClone能力实现深度拷贝对象。每种方式都有其优缺点,具体使用方式取决于你的需求和目标对象的类型。
window.structuredClone 全局的 structuredClone() 方法使用结构化克隆算法将给定的值进行深拷贝 图片 图片 当克隆Function、Dom节点时,会报错 图片 图片 其他数据类型可以成功拷贝~ 图片
const transferred = structuredClone(uInt8Array, { transfer: [uInt8Array.buffer], }); console.log(uInt8Array.byteLength); // 0 总的来说,structuredClone()是 JavaScript 开发者工具箱中的一个宝贵补充,使对象克隆比以往任何时候都更容易。
没错,这个内置于 JavaScript 运行时的structuredClone函数就是这样: const calendarEvent = { title: "Builder.io大会", date: new Date(123), attendees: ["Steve"] } // 😍 const copied = structuredClone(calendarEvent) 您是否注意到在上面的例子中,我们不仅复制了对象,还复制了嵌套数组,甚至还包括Date...
structuredClone()创建了一个深拷贝,保留了结构,没有任何JSON.stringify()的限制,并能处理循环引用和undefined等复杂数据类型。 2. 循环引用 使用{...obj}处理循环引用 const original = { name: "Alice", self: null }; original.self = original; // 这将导致错误: ...
全局的structuredClone()方法使用结构化克隆算法将给定的值进行深拷贝 2.2. 语法 structuredClone(value)structuredClone(value,{transfer}) 2.2. 参数 value:被克隆的对象 transfer:可转移的数组 2.3. 返回值 返回值是原始值的深拷贝 2.4. 如果输入值的任一部分不可序列化,则抛出DataCloneError异常 ...
因此,如果我们的需求适合这个方法,可以用这个方法。但是,我们可以用structuredClone做这个方法有很多不能做的事情。 为什么不是 _.cloneDeep? 到目前为止,Lodash 的 cloneDeep 函数是这个问题的一个非常常见的解决方案。事实上,这确实也像预期的那样工作:
https://github.com/zloirock/core-js#structuredclone bugs Uncaught DOMException: Failed to execute 'structuredClone' on 'Window': (v) => console.log(v) could not be cloned. Uncaught DOMException: Failed to execute 'structuredClone' on 'Window': function (v) {console.log(v)} could not be...
1. 为什么需要 StructuredClone 下面是一个使用 StructuredClone 方法克隆对象的示例：const calendarEvent = { title: "Builder.io Conf", date: new Date(123), attendees: ["Steve"]}// 赋值对象const copied = structuredClone(calendarEvent)以上代码示例表明，StructuredClone 不仅可以复制对象，还可以复制...
log(clone); // 深拷贝的对象,与 original 内容相同但内存地址不同 总结来说,遇到 "structuredClone is not defined" 错误时,首先要检查你的环境是否支持该方法,然后根据环境情况选择合适的解决方案。 🚀 高效开发必备工具 🚀 🎯 一键安装IDE插件,智能感知本地环境💡精准解答,深得你心 ✨ 开启高效开发...