js深拷贝三种方法

news2025/1/15 15:42:40

使用递归函数实现深拷贝

const obj = {
      name: 'zzz',
      age: 18,
      hobby: ['篮球', '足球'],
      family: {
        baby: 'baby'
      }
    }
// 深拷贝   数组  对象  一定要先筛数组再筛对象,因为万物皆对象
    function deepcopy(newObj, oldObj) {
      for (const k in oldObj) {
        // 判断值是否属于array类
        if (oldObj[k] instanceof Array) {
          // 先将newo中hobby置空  newObj[hobby]=[]
          newObj[k] = []
          // 然后再将旧数据的数组值拷贝给新的数组值  newObj[hobby]=oldObj[hobby]
          deepcopy(newObj[k], oldObj[k])
        } else if (oldObj[k] instanceof Object) {
          newObj[k] = {}
          deepcopy(newObj[k], oldObj[k])
        } else {
          //newObj[k] ===newObj.name  给对象添加新属性
          newObj[k] = oldObj[k]
        }
      }
    }
 const newo = {}
    deepcopy(newo, obj)
    console.log(newo);
    newo.age = 11
    newo.hobby[0] = '羽毛球'
    newo.family.baby = 'bbbb'
    console.log(obj);

在这里插入图片描述

使用lodash的_.cloneDeep方法实现深拷贝

官网下载lodash https://www.lodashjs.com/

//引用
  <script src="./lodash.min.js"></script>
 // lodash库
    const obj_l = {
      name: 'zzz',
      age: 18,
      hobby: ['篮球', '足球'],
      family: {
        baby: 'baby'
      }
    }
    const o_l = _.cloneDeep(obj_l)

    o_l.age = 11
    o_l.hobby[0] = '羽毛球'
    o_l.family.baby = 'bbbb'
    console.log(o_l);
    console.log(obj_l);

在这里插入图片描述

使用json的JSON.parse()JSON.stringify()方法实现深拷贝

    // json深拷贝
    const obj_j = {
      name: 'zzz',
      age: 18,
      hobby: ['篮球', '足球'],
      family: {
        baby: 'baby'
      }
    }
    // /JSON.stringify  将对象转为json字符串
    const o_j = JSON.parse(JSON.stringify(obj_j))
    o_j.age = 11
    o_j.hobby[0] = '羽毛球'
    o_j.family.baby = 'bbbb'
    console.log(o_j);
    console.log(obj_j);

在这里插入图片描述

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

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

相关文章

linux搭建minIO对象存储服务,springBoot整合

minIO 服务搭建 1. 创建安装目录 mkdir -p /usr/local/minio2. 进入安装目录 cd /usr/local/minio3.下载安装包 (wget 如果下载太慢,可以手动下载并上传安装包) wget https://dl.minio.io/server/minio/release/linux-amd64/minio4.创建数据存储文件夹 mkdir -p /usr/loca…

gradle 环境配置

环境变量 # gradle 构建工具目录 export GRADLE_HOME/Users/tangjianghua5/software/gradle-6.0 export PATH$PATH:$GRADLE_HOME/bin # gradle 本地仓库目录 export GRADLE_USER_HOME/Users/tangjianghua5/.m2/repository export PATH$PATH:$GRADLE_USER_HOME全局配置 init.gr…

【LeetCode】437.路径总和Ⅲ

题目 给定一个二叉树的根节点 root &#xff0c;和一个整数 targetSum &#xff0c;求该二叉树里节点值之和等于 targetSum 的 路径 的数目。 路径 不需要从根节点开始&#xff0c;也不需要在叶子节点结束&#xff0c;但是路径方向必须是向下的&#xff08;只能从父节点到子节…

继承抽象类习题答案

基础题目 第一题&#xff1a;概念辨析 什么叫做类与类的继承&#xff0c;作用是什么&#xff1f; 就是子类继承父类的属性和行为&#xff0c;使得子类对象具有与父类相同的属性、相同的行为。作用是子类复用父类内容。 继承后&#xff0c;父类与子类之间&#xff0c;各成员有…

融合CDN 如何有效的抵抗DDoS攻击

绝大部分对外网站所有者都离不开CDN的支持&#xff0c;据统计&#xff0c;全球高达70%的互联网流量都是通过CDN来进行缓存和加速的&#xff0c;不论是国外知名的CDN厂商&#xff1a;如Cloudflare、AWS、Akamai等&#xff0c;还是国内主流的CDN厂商阿里云华为云腾讯云等&#xf…

vue 实现word文档预览和下载 docx-preview 和 vue-office

1.先下载引入 npm i docx-preview --save import { renderAsync } from docx-preview;2.使用 fetch(url) .then((response) > {let docData response.blob(); //将文件转换成bolb形式//选择要渲染的元素let childRef document.getElementsByClassName("childRef&qu…

【ulimit 命令】LINUX单进程能够打开的最大文件句柄数

Linux系统如何查看修改最大打开文件数,这个问题对于很多刚刚学习linux的小伙伴来说觉得有点奇怪。Linux系统和windows不同之处在于更强的多任务多线程,由于文件系统结构的不同linux针对不同进程不同用户都可以设置最打打开文件数。 查看当前系统最大的文件打开数,如下图 在…

5165. CCC单词搜索

题目链接&#xff1a;https://www.acwing.com/problem/content/5168/ 题目&#xff1a; 给定一个 RC 的大写字母矩阵。 请你在其中寻找目标单词 W。 已知&#xff0c;目标单词 W 由若干个不同的大写字母构成。 目标单词可以遵循以下两种规则&#xff0c;出现在矩阵的水平、…

c++11 标准模板(STL)(std::basic_istringstream)(四)

定义于头文件 <sstream> template< class CharT, class Traits std::char_traits<CharT> > class basic_istringstream;(C11 前)template< class CharT, class Traits std::char_traits<CharT>, class Allocator std::allo…

电脑桌面日历提醒怎么设置?设置日期提醒的简单方法

在我们使用电脑办公或学习时&#xff0c;为了避免忘记重要事项&#xff0c;例如会议、截止日期等&#xff0c;我们常常希望能在电脑桌面设置日历提醒。一般来说&#xff0c;电脑系统自带的日历上可以新增日程并设置提醒日期。那么电脑桌面日历提醒怎么设置呢&#xff1f; 很多人…

RocketMQ-(7-1)-可观测-Metrics

RocketMQ 以 Prometheus 格式公开以下指标。您可以使用这些指标监视您的集群。 服务端 Metrics 指标生产者 Metrics 指标消费者 Metrics 指标 版本支持&#xff1a;以下指标 Metrics 是从 5.1.0 版本开始支持。 Metrics 指标详情​ Metric types​ 消息队列 RocketMQ 版定义…

微调llama2模型教程:创建自己的Python代码生成器

本文将演示如何使用PEFT、QLoRa和Huggingface对新的lama-2进行微调&#xff0c;生成自己的代码生成器。所以本文将重点展示如何定制自己的llama2&#xff0c;进行快速训练&#xff0c;以完成特定任务。 一些知识点 llama2相比于前一代&#xff0c;令牌数量增加了40%&#xff0…

CentOS7.9安装Java11

文章目录 Java11版本介绍安装步骤查看并卸载已有版本安装Java11最新版本配置生效 openjdk介绍 Java11版本介绍 Java 11是Java编程语言的一个重要版本&#xff0c;于2018年9月发布Java 11在语言特性、性能优化和安全性方面都有一些显著的改进&#xff0c;为Java开发者提供了更多…

.NetCore之log4net的使用

1.首先下载log4ne的包&#xff1a; 2.添加配置文件log4net.config <?xml version"1.0" encoding"utf-8" ?> <configuration><!-- This section contains the log4net configuration settings --><log4net><appender name&q…

初探函数式编程---以Map/Reduce/Filter为例

如函数式编程--酷壳[1] 总结&#xff0c; 函数式编程的三大特性; 数据不可变性 函数作为一等公民(函数可以像变量一样来创建/修改/传递 等) 尾递归优化(重用stack,减轻栈的压力) 函数式编程用到的几个技术&#xff1a; 函数式编程的理念&#xff1a;把函数当成变量来用&#xf…

亚马逊电咖啡壶UL1082测试标准

UL1082标准是适用于额定电压为120V,按照国家电气编码进行使用的便携式电咖啡壶&#xff0c;咖啡渗漏壶及其它酿造类器具&#xff0c;除了咖啡壶外&#xff0c;本标准也适用于荼壶、水煲、玻璃水煲、汤保温壶及其它类似器具。这些器具都具有以下特点&#xff1a; &#xff08;1…

Day06-Vue全家桶项目

Day01-Vue全家桶项目 一 全家桶项目介绍 Vue在使用脚手架创建项目的时候,提供前端工程化项目 目前主要学习了Vue基础:Vue指令、Vue组件开发、Vue样式、组件通信、生命周期 全家桶项目是很多技术结合的一种开发模式: 全家桶项目搭建路由搭建(前端路由)网络请求封装Elem…

【Java从0到1学习】11 Java集合框架

1. Collection 1.1 Java类中集合的关系图 1.2 集合类概述 在程序中可以通过数组来保存多个对象&#xff0c;但在某些情况下开发人员无法预先确定需要保存对象的个数&#xff0c;此时数组将不再适用&#xff0c;因为数组的长度不可变。例如&#xff0c;要保存一个学校的学生信…

华为数通方向HCIP-DataCom H12-821题库(单选题:81-100)

第81题 某公司新购入一台网络设备,作为网络管理员,初次配置该设备通常通过什么方式? A、FTP B、Telnet C、SNMP D、Console 口登录 答案: D 解析&#xff1a; 通常情况下&#xff0c;初次配置网络设备会通过Console口登录的方式进行。Console口是一种串口接口&#xff0c…

网络安全工程师岗位一览-徐庆臣(黑客洗白者)

安全服务工程师 安全运维工程师 渗透测试工程师 Web安全工程师 安全攻防工程师 等保测评工程师 …… 代码审计工程师 威胁分析工程师 无线安全工程师 安全研发工程师 移动安全工程师 云计算安全工程师 ……