JavaScript

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > JavaScript 深拷贝方法

JavaScript深拷贝方法structuredClone使用

作者:天行无忌

这篇文章主要为大家介绍了JavaScript深拷贝方法structuredClone使用示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

正文

对于深拷贝,最容易也应该是常见的方法是使用 JSON.parse() + JSON.stringify() ,还有一个借助第三方脚本库 lodash ,其中方法 cloneDeep 可以实现深拷贝。现在可以使用原生的 structuredClone() 方法。

浅拷贝与深拷贝

首先,先来了解一下浅拷贝和深拷贝的区别:

使用 structuredClone 进行深拷贝

原生 structuredClone() 方法使用结构化克隆算法创建给定值的深层拷贝。

结构化克隆算法用于复制复杂 JavaScript 对象的算法。通过来自 Worker 的 postMessage() 或使用 IndexedDB 存储对象时在内部使用。它通过递归输入对象来构建克隆,同时保持先前访问过的引用的映射,以避免无限遍历循环。

语法如下:

structuredClone(value)
structuredClone(value, { transfer })

返回值:返回值是原始值的深拷贝。

下面是示例代码:

const objProfile = { name: "DevPoint", detail: { age: 30 } };
const deepCopy = structuredClone(objProfile);
const shallowCopy = { ...deepCopy };
console.log(shallowCopy); // {"name": "DevPoint", "detail": {  "age": 35 } }
deepCopy.name = "天行无忌";
deepCopy.detail.age = 35;
console.log(objProfile); // {"name": "DevPoint", "detail": {  "age": 30 } }
console.log(deepCopy); // {"name": "天行无忌", "detail": {  "age": 35 } }

正如在此代码片段中所见:

structuredClone() 现在可在所有主流浏览器和运行时(如 Node.jsDeno)的最新版本中使用。

以上就是JavaScript 中深拷贝方法structuredClone的详细内容,更多关于JavaScript 深拷贝的资料请关注脚本之家其它相关文章!

您可能感兴趣的文章:
阅读全文