js【详解】深拷贝

  什么是深拷贝?

对于引用类型的数据,才有深浅拷贝的说法

  • 浅拷贝 :执行拷贝的变量只复制被拷贝变量内存的引用数据的地址。
被拷贝变量内地址指向的数据发生变化时,执行拷贝的变量也会同步改变
  • 深拷贝
  1. 在堆内存中开辟一个全新的存储空间
  2. 将被拷贝变量中引用地址对应的内容完整复制一份存入新的存储空间
  3. 将新的存储空间的地址存入执行拷贝的变量中。
被拷贝变量内地址指向的数据发生变化时,执行拷贝的变量不会改变

深拷贝方案一 JSON.parse(JSON.stringify(obj))

缺陷:

  • 属性值为函数和undefined的属性会丢失
  • 属性值为正则表达式的会变成{}
  • 属性值为时间对象的会变成时间字符串
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <script>
      let obj = {
        string: "字符串",
        Number: 10,
        null: null,
        undefined: undefined,
        date: new Date(),
        function: () => {
          console.log("函数");
        },
        RegExp: /^([0]{2}|0[1-9]|[1-9])\d*$/,
      }
      console.log("被拷贝的对象");
      console.log(obj);
      let objJSONclone = JSON.parse(JSON.stringify(obj));
      console.log("使用JSON.parse(JSON.stringify(obj))拷贝对象");
      console.log(objJSONclone);

    </script>
  </body>
</html>

 深拷贝方案二

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <script>
      /**
       * 深拷贝
       * @param {Object} obj 要拷贝的对象
       */
      let obj = {
        string: "字符串",
        Number: 10,
        null: null,
        undefined: undefined,
        date: new Date(),
        function: () => {
          console.log("函数");
        },
        RegExp: /^([0]{2}|0[1-9]|[1-9])\d*$/,
      }
      function deepClone(obj) {
        if (obj === null) return null;
        if (typeof obj !== "object") return obj;
        if (obj.constructor === Date) return new Date(obj);
        if (obj.constructor === RegExp) return new RegExp(obj);
        var newObj = new obj.constructor(); //保持继承链
        for (var key in obj) {
          //不遍历其原型链上的属性
          if (obj.hasOwnProperty(key)) {
            var val = obj[key];
            // 使用arguments.callee解除与函数名的耦合
            newObj[key] = typeof val === "object" ? arguments.callee(val) : val; 
          }
        }
        return newObj;
      }
      let test = deepClone(obj)
      console.log(test)
    </script>
  </body>
</html>

 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

高效输入关键词,瞬间生成惊艳图片:创意与速度的完美结合!

在数字化时代&#xff0c;图片已经成为我们生活中不可或缺的一部分。无论是社交媒体的分享、广告的创意&#xff0c;还是工作中的报告展示&#xff0c;高质量的图片都能为我们的内容增添不少色彩。但你是否曾遇到过这样的困扰&#xff1a;想要一张符合心意的图片&#xff0c;却…

VScode前端常用插件推荐

Color Highlight—查看css颜色 这个插件可以让我们在vscode中看到代码中的颜色&#xff0c;效果如图所示 Chinese (Simplified) (简体中文) Language Pack for Visual Studi ------ 简体中文语言包 把vscode翻译为中文 Auto Rename Tag—自动修改对应的标签 效果如图所示…

uniapp+uview实现城市选择器

1.效果 2.代码—在components中创建CitySelect组件 <template><view><text class"uni-input" style"background-color: #F8F8F8;display: block;line-height: 76rpx;padding:0 29rpx;" tap"open">{{value}}</text><…

01-java面试题八股文-----java基础——20题

文章目录 <font color"red">1、java语言有哪些特点&#xff1a;<font color"red">2、面向对象和面向过程的区别<font color"red">3、标识符的命名规则。<font color"red">4、八种基本数据类型的大小&#xff…

linux下用docker安装mysql及导入文件

目录 1. 非root用户设置docker权限2. user账号安装mysql2. root账号打开防火墙3. 启动mysql容器3.1 在指定工作目录下建立文件夹3.2 配置文件3.3 开启mysql容器 4. 进入容器4.1 通过容器进入mysql4.1 设置账号4.2 建立数据库4.3 导入文件 5. windows连接数据库参考文件 1. 非ro…

.locked勒索病毒是什么,企业数据被加密了如何恢复?

.locked勒索病毒介绍 .locked勒索病毒是一种恶意软件&#xff0c;它利用加密技术锁定用户的数据或系统&#xff0c;并以此进行勒索。用户一旦感染此病毒&#xff0c;将无法访问其重要文件&#xff0c;病毒会要求用户支付一笔赎金以获取解密密钥。这种病毒通常使用强大的加密算法…

ssm基于Vue.js的在线购物系统的设计与实现论文

摘 要 随着科学技术的飞速发展&#xff0c;各行各业都在努力与现代先进技术接轨&#xff0c;通过科技手段提高自身的优势&#xff1b;对于在线购物系统当然也不能排除在外&#xff0c;随着网络技术的不断成熟&#xff0c;带动了在线购物系统&#xff0c;它彻底改变了过去传统的…

C#配置连接数据库字段

在Web.config文件中 添加如下配置 <!--连接数据库字段--><connectionStrings><add name"sql" connectionString"server.;uidsa;pwd8888;databaseArticleWebSite" /></connectionStrings>

Harbor介绍

1.什么是Harbor Harbor是一个开源的企业级Docker Registry管理项目&#xff0c;由VMware公司开源。 Harbor提供了比Docker官方公共镜像仓库更为丰富和安全的功能&#xff0c;尤其适合企业环境使用。以下是Harbor的一些关键特性&#xff1a; 权限管理&#xff08;RBAC&#x…

mysql 空间查询 多边形内的点

数据库查询 # 1新增空间point类型坐标字段 ALTER TABLE gaoxin_isdp.business_master ADD COLUMN location2 point NULL AFTER location;# 2从原字段更新点位字段&#xff0c;原字段poi1是字符串106.474596,29.464360 UPDATE business_master SET location POINT(substr(poi…

BetterDisplay Pro:让屏幕管理更高效、更便捷

BetterDisplay Pro是一款功能强大的显示器管理软件&#xff0c;适用于Windows和Mac操作系统。其主要功能包括显示器校准、自动校准、多种预设模式、手动校准以及可视化数据等。 具体而言&#xff0c;这款软件可以根据用户的需求和环境条件调整显示器的颜色、亮度和对比度等参数…

YOLO改进模块出现的问题及改进方法

1.grid_sampler_2d_backward_cuda 在对YOLOv9进行改进的过程中&#xff0c;有的时候就会出现这种报错&#xff1a;RuntimeError: grid_sampler_2d_backward_cuda does not have a deterministic implementation&#xff0c;but you set torch.use_deterministic_algorithms(Tr…

免费阅读篇 | 芒果YOLOv8改进111:注意力机制CBAM:轻量级卷积块注意力模块,无缝集成到任何CNN架构中,开销可以忽略不计

&#x1f4a1;&#x1f680;&#x1f680;&#x1f680;本博客 改进源代码改进 适用于 YOLOv8 按步骤操作运行改进后的代码即可 该专栏完整目录链接&#xff1a; 芒果YOLOv8深度改进教程 该篇博客为免费阅读内容&#xff0c;YOLOv8CBAM改进内容&#x1f680;&#x1f680;&am…

Sora的前世今生:从文生图到文生视频

在2月16日凌晨&#xff0c;OpenAI首款文本生成视频模型Sora正式亮相&#xff0c;迅速在网络上引发广泛关注。对于Sora背后的技术原理&#xff0c;网络上已经充斥着各种分析和猜测&#xff0c;其中大多数分析都是从技术报告入手&#xff0c;对于普通读者来说难度相对较高。为了使…

第 6 章 ROS-URDF练习(自学二刷笔记)

重要参考&#xff1a; 课程链接:https://www.bilibili.com/video/BV1Ci4y1L7ZZ 讲义链接:Introduction Autolabor-ROS机器人入门课程《ROS理论与实践》零基础教程 6.3.4 URDF练习 需求描述: 创建一个四轮圆柱状机器人模型&#xff0c;机器人参数如下&#xff0c;底盘为圆柱…

HarmonyOS NEXT应用开发之跨文件样式复用和组件复用

介绍 本示例主要介绍了跨文件样式复用和组件复用的场景。在应用开发中&#xff0c;我们通常需要使用相同功能和样式的ArkUI组件&#xff0c;例如购物页面中会使用相同样式的Button按钮、Text显示文字&#xff0c;我们常用的方法是抽取公共样式或者封装成一个自定义组件到公共组…

SpringBoot+Vue前后端分离项目在Linux系统中基于Docker打包发布

文章目录 SpringBootVue前后端分离项目在Linux系统中基于Docker打包发布一、Java项目基于Docker打包发布1.打包应用&#xff0c;将打好的jar包放到我们的linux系统中2.新建dockerfile3.打包镜像4.测试运行5.上传镜像到阿里云免费私仓 二、Vue项目打包到docker镜像1.编译打包前端…

龙智亮相2024国际集成电路展览会暨研讨会(IIC Shanghai),分享芯片研发及管理解决方案与技术实践

2024年3月28-29日&#xff08;周四-周五&#xff09;&#xff0c;上海张江科学会堂&#xff0c;2024国际集成电路展览会暨研讨会&#xff08;IIC Shanghai 2024&#xff09;即将盛大开幕。龙智携芯片研发及管理解决方案、最佳实践与案例&#xff0c;以及惊喜大奖在#1A14展位等着…

Docker容器化技术(docker-compose示例:部署discuz论坛和wordpress博客,使用adminer管理数据库)

安装docker-compose [rootservice ~]# systemctl stop firewalld [rootservice ~]# setenforce 0 [rootservice ~]# systemctl start docker[rootservice ~]# wget https://github.com/docker/compose/releases/download/v2.5.0/docker-compose-linux-x86_64创建目录 [rootse…

模方软件匀色功能是灰色的不能点是什么原因?

问题如图 模方软件试用版没有匀色权限&#xff0c;正式版才可以用 。 下方链接有1个月的授权&#xff0c;有需要可以点开&#xff0c;软件正式版的可以使用匀色这个功能。https://item.jd.com/10037263088236.html