window.structuredClone 深拷贝

news2024/11/30 19:58:58

概述: structuredClone 是一种新的 JavaScript 原生方法,用于创建一个对象的深拷贝。与传统的浅拷贝方法(如 Object.assign 或数组的 slice)不同,structuredClone 可以递归地拷贝对象,包括其中的嵌套对象、数组、Date、Map、Set、ArrayBuffer 等复杂数据结构
structuredClone 与传统拷贝方式的区别:

1.传统拷贝:

  • 浅拷贝: 使用 Object.assign 或者扩展运算符(…)进行拷贝时,只有对象的第一层会被拷贝,嵌套的对象或数组将是引用传递。

  • 递归深拷贝: 使用递归实现深拷贝,能够拷贝嵌套对象,但是无法处理一些特殊的对象类型(如 Date、RegExp、Map 等)。

传统拷贝可以跳转 js 深浅拷贝的区别和实现

2.structuredClone:

  • 深拷贝: structuredClone 会递归地复制整个对象,包括所有嵌套的对象和数组。
  • 处理特殊对象: 它可以处理包括 Date、RegExp、Map、Set、ArrayBuffer 等对象类型,避免了传统方法中的不足。

以下是structureClone的使用方法:


let a = {b: {c: 1}};
let b = structuredClone(a);
console.log(b, a===b, a.b ===b.b)

注意事项:

1.不能克隆某些类型:

  • Function(函数)
  • RegExp(正则表达式)
  • Error 对象
  • WeakMap 和 WeakSet
  • 带有循环引用的对象

2.性能: 尽管 structuredClone 提供了一个方便的深拷贝解决方案,但它的性能开销可能会比浅拷贝方法大。因此,应该根据实际需求评估是否使用它,尤其是在处理非常大的对象时。

3.兼容性: structuredClone 是 ECMAScript 2021(ES12)引入的标准方法,在现代浏览器中已经得到了广泛支持
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2250653.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

java全栈day10--后端Web基础(基础知识)

引言:只要能通过浏览器访问的网站全是B/S架构,其中最常用的服务器就是Tomcat 在浏览器与服务器交互的时候采用的协议是HTTP协议 一、Tomcat服务器 1.1介绍 官网地址:Apache Tomcat - Welcome! 1.2基本使用(网上有安装教程,建议…

java:拆箱和装箱,缓存池概念简单介绍

1.基本数据类型及其包装类: 举例子: Integer i 10; //装箱int n i; //拆箱 概念: 装箱就是自动将基本数据类型转换为包装器类型; 拆箱就是自动将包装器类型转换为基本数据类型; public class Main {public s…

保持角色一致性!flux新模型redux用法(含模型与工作流)

​ 目录 redux模型是什么,能干啥? 用到的工具有哪些? 工具和模型文件在哪里下载? 整合包: 下载后需要分别放到指定目录: redux模型怎么用? 加载工作流 上传图片和输入提示词 生成结果…

通信原理实验:抽样定理实验

目录 一、实验目的和要求 二、实验内容和原理 实验器材 实验原理 三、实验步骤 (一)实验项目一:抽样信号观测及抽样定理验证 四、实验记录与处理 结论: 辅助学习资料: 五、实验结果及分析 一、实验目的和要求 了解抽样定理在通信系统中的重要性。掌握自然抽样及…

HarmonyOS NEXT应用开发,关于useNormalizedOHMUrl选项的坑

起因是这样的:我这库打包发布出问题了,这个有遇到的吗? 源码里面就没有 request .d.ts,这打包后哪来个这文件?且漏掉了其他文件。 猫哥csdn.yyz_1987 为啥我打包的har里面,只有接口,没有具体实现呢&#x…

Ubuntu Server 22.04.5 从零到一:详尽安装部署指南

文章目录 Ubuntu Server 22.04.5 从零到一:详尽安装部署指南一、部署环境二、安装系统2.1 安装2.1.1 选择安装方式2.1.2 选择语言2.1.3 选择不更新2.1.4 选择键盘标准2.1.5 选择安装版本2.1.6 设置网卡2.1.7 配置代理2.1.8 设置镜像源2.1.9 选择装系统的硬盘2.1.10 …

学成在线day07

视频处理 技术方案 掌握了xxl-job的分片广播调度方式,下边思考如何分布式去执行学成在线平台中的视频处理任务。 任务添加成功后,对于要处理的任务会添加到待处理任务表中,现在启动多个执行器实例去查询这些待处理任务,此时如何…

在国外,使用中国移动app办理停机保号

1.人在国内的时候,先使用手机下载中国移动app 以前网上营业厅是可以直接办理停机保号的,现在不可以了 2.人在国内的时候,确保自己的手机能够登录中国移动app 这个步骤保证回国前可以使用中国移动app复机 3.人在国内的时候,拨打…

husky,commit规范,生成CHANGELOG.md,npm发版

项目git提交工程化(钩子,提交信息commit message),npm修改版本,需要涉及到的包: husky,允许在git钩子中执行不同的脚步,如commitlint,eslint,prettier&#…

如何用 Python 构建你的第一个机器学习项目

目录 一、选择你的机器学习项目 二、准备你的开发环境 三、加载和探索数据 四、数据预处理 五、拆分数据集 六、选择并训练模型 七、评估模型 八、可视化模型 九、优化模型 十、部署模型 十一、总结 机器学习是当今技术领域的热门话题,它能够帮助我们从数…

JVM指令集概览:基础与应用

写在文章开头 在现代软件开发中,Java 语言凭借其“一次编写,到处运行”的理念成为了企业级应用的首选之一。这一理念的背后支撑技术正是 Java 虚拟机(JVM)。JVM 是一个抽象的计算机,它实现了 Java 编程语言的各种特性,并且能够执行编译后的字节码文件。了解 JVM 的工作原…

Leetcode 每日一题 104.二叉树的最大深度

目录 问题描述 示例 示例 1: 示例 2: 约束条件 题解 方法一:广度优先搜索(BFS) 步骤 代码实现 方法二:递归 步骤 代码实现 结论 问题描述 给定一个二叉树 root,我们需要返回其最大…

【微服务】 Eureka和Ribbon

一、Eureka 服务调用出现的问题:在远程调用另一个服务时,我们采用的解决办法是发送一次http请求,每次环境的变更会产生新的地址,所以采用硬编码会出现很多麻烦,并且为了应对并发问题,采用分布式部署&#…

蓝桥杯c++算法秒杀【6】之动态规划【下】(数字三角形、砝码称重(背包问题)、括号序列、异或三角:::非常典型的必刷例题!!!)

别忘了请点个赞收藏 关注支持一下博主喵!!!! ! ! ! ! 关注博主,更多蓝桥杯nice题目静待更新:) 动态规划 三、括号序列 【问题描述】 给定一个括号序列,要求尽可能少地添加若干括号使得括号序列变…

SpringMVC工作原理【流程图+文字详解SpringMVC工作原理】

SpringMVC工作原理 前端控制器:DispactherServlet处理器映射器:HandlerMapping处理器适配器:HandlerAdapter处理器:Handler,视图解析器:ViewResolver视图:View 首先用户通过浏览器发起HTTP请求…

你真的会用饼图吗?JVS-智能BI饼图组件深度解析

在数据可视化的世界里,饼图是我们常见的一种可视化图形。在JVS-智能BI中提供了数据可视化饼图组件,接下来我通过这篇文章详细介绍,从配色方案到图形配置,从显示数据到提示信息,饼图的每一个细节配置。 饼图类图表概述…

Redis中的分布式锁(步步为营)

分布式锁 概述 分布式锁指的是,所有服务中的所有线程都去获取同一把锁,但只有一个线程可以成功的获得锁,其他没有获得锁的线程必须全部等待,直到持有锁的线程释放锁。 分布式锁是可以跨越多个实例,多个进程的锁 分布…

今日codeforces刷题(1)

一、前言 新栏目,每隔几天就保质保量地刷个10道codeforces题左右的样子 筛选1200-1500难度的题,然后按通过题目的人数降序排列的前10题 二、题目总览 三、具体题目 3.1 25A. IQ test 我的代码 看奇数出现的次数为1还是偶数出现的次数为1&#xff0c…

北京科博会 天云数据CEO雷涛谈人工智能技术服务数字资产建设

7月13日,第二十六届中国北京国际科技产业博览会(简称北京科博会)在国家会议中心开幕。本届科博会年度主题为“实施创新驱动发展战略 增强高质量发展动能”。会上,天云数据CEO雷涛发表《人工智能技术服务数字资产建设》主题演讲。 近期非常引人注目的事件…

不一样的css(三)

目录 一、前言 二、五角星 1.五角星,叠盖法: 2.五角星,拼凑法: 3.五角星,svg画法: 4.五角星,利用clip-path属性进行裁剪 三、结束语 一、前言 通过上两节的内容我们对css画小图标有了新…