当前位置: 首页 > news >正文

js_三种方法实现深拷贝

  1. 深拷贝( 递归 )

适用于需要完全独立于原始对象的场景,特别是当对象内部有引用类型时,为了避免修改拷贝后的对象影响到原始对象,就需要使用深拷贝。

// 原始对象
const obj = { uname: 'Lily',age: 19,hobby: ['乒乓球', '篮球'],family:{baby:'老baby'}}// 新对象const o = {} // 拷贝函数function deepCopy(newObj, oldObj) {for(let k in oldObj){// 递归优先级 Array → Object// 判断对象属性是否为数组类型if(oldObj[k] instanceof Array){newObj[k] = []  // newObj[k] === o.hobbydeepCopy(newObj[k], oldObj[k])}else if (oldObj[k] instanceof Object) {newObj[k] = {}  // newObj[k] === o.familydeepCopy(newObj[k], oldObj[k])}else{// newObj[k] === o.unamenewObj[k] = oldObj[k]   }}}deepCopy(o, obj)o.age = 20o.hobby[0] = '足球'o.family.baby = '小baby' console.log(o)   console.log(obj) 

在这里插入图片描述

  1. 深拷贝( lodash )

Lodash 的 __.cloneDeep 方法可以实现深拷贝,它能够处理各种复杂的数据类型和嵌套结构。

语法规范:_.cloneDeep(value)

// 需要先在src中引入 lodash.min.js 文件
<script src="./js/lodash.min.js"></script>
<script>const obj = {uname:'Lily',age:18,hobby:['乒乓球','足球'],family:{baby: '老baby'}}const o = _.cloneDeep(obj)o.family.baby = '小baby'console.log(o)  console.log(obj) 
</script>

lodash实现深拷贝

  1. 深拷贝( JSON )

JSON.stringify() 用于将JavaScript对象或值转换成一个JSON字符串

JSON.parse(text[, reviver]) 将一个符合JSON格式的字符串转换成JavaScript对象或数组

const obj = {uname:'Lily',age:18,hobby:['乒乓球','足球'],family:{baby: '老baby'}}const o = JSON.parse(JSON.stringify(obj))// 将原对象转换成字符串后又转换为对象,这个新对象与原对象无关联console.log(o)o.hobby[0] = '篮球'o.family.baby = '小baby'console.log(obj)

在这里插入图片描述

相关文章:

js_三种方法实现深拷贝

深拷贝&#xff08; 递归 &#xff09; 适用于需要完全独立于原始对象的场景&#xff0c;特别是当对象内部有引用类型时&#xff0c;为了避免修改拷贝后的对象影响到原始对象&#xff0c;就需要使用深拷贝。 // 原始对象 const obj { uname: Lily,age: 19,hobby: [乒乓球, 篮球…...

【图论经典题目讲解】CF715B - Complete The Graph

C F 715 B − C o m p l e t e T h e G r a p h \mathrm{CF715B - Complete\ The\ Graph} CF715B−Complete The Graph D e s c r i p t i o n \mathrm{Description} Description 给定一张 n n n 个点&#xff0c; m m m 条边的无向图&#xff0c;点的编号为 0 ∼ n − 1 0\…...

[office] excel中数据汇总的大全教程文字版 #知识分享#经验分享#知识分享

excel中数据汇总的大全教程文字版 我们在excel中对数据清单上的数据进行分析的一种方法是分类汇总。在“数据”菜单上选择“分类汇总”命令&#xff0c;我们可以在数据清单中插入分类汇总行&#xff0c;然后按照选择的方式对数据进行汇总。同时&#xff0c;在插入分类汇总时&am…...

leetcode经典题库(简单)

文章目录 1.两数之和2.反转链表3.合并两个有序列表4.合并两个有序链表5.删除有序数组中的重复项6.从数组中移除元素7. 搜索指定数值在数组中的插入位置8. 数组最后一位加一9. 合并两个有序数组在leetcode上刷了几个和数组相关的简单题,记录在这里。 1.两数之和 给定一个整数…...

python coding with ChatGPT 打卡第21天| 二叉树:最近公共祖先

相关推荐 python coding with ChatGPT 打卡第12天| 二叉树&#xff1a;理论基础 python coding with ChatGPT 打卡第13天| 二叉树的深度优先遍历 python coding with ChatGPT 打卡第14天| 二叉树的广度优先遍历 python coding with ChatGPT 打卡第15天| 二叉树&#xff1a;翻转…...

openGauss学习笔记-224 openGauss性能调优-系统调优-数据库系统参数调优-数据库并发队列参数调优

文章目录 openGauss学习笔记-224 openGauss性能调优-系统调优-数据库系统参数调优-数据库并发队列参数调优224.1 全局并发队列224.2 局部并发队列 openGauss学习笔记-224 openGauss性能调优-系统调优-数据库系统参数调优-数据库并发队列参数调优 数据库提供两种手段进行并发队…...

UE5 C++ 创建可缩放的相机

一.要将相机设置在Pawn类里 1.在MyPawn头文件里&#xff0c;加上摇臂和相机组件 #include "GameFramework/SpringArmComponent.h" #include "Camera/CameraComponent.h" 2.在Pawm里声明SceneComponet&#xff0c;SpringArmComponent,CameraComponent组件…...

Fabric中的溯源方法

背景 在Fabric链码中&#xff0c;我们可以使用PutState方法对一个key的值进行覆盖&#xff0c;当我们再使用GetState查询时是最新的值。如果我们希望找到这个key的修改记录&#xff0c;我们可以使用溯源方法GetHistoryForKey。完整源码链接&#xff1a;https://github.com/hyp…...

混子文章|蓝桥杯一题 -平方差

题目考点: 平方差 ,平方差奇偶关系 代码 #include<bits/stdc.h> #define Run 0 #define endl "\n" #define N 100005 using unl __int128_t; using ll long long; using namespace std; class Solution { public: void slove() {int sum 0;int L, R; cin &…...

计算机视觉基础:【矩阵】矩阵选取子集

OpenCV的基础是处理图像&#xff0c;而图像的基础是矩阵。 因此&#xff0c;如何使用好矩阵是非常关键的。 下面我们通过一个具体的实例来展示如何通过Python和OpenCV对矩阵进行操作&#xff0c;从而更好地实现对图像的处理。 示例 示例&#xff1a;选取矩阵中指定的行和列的…...

解决laravel-admin安装报错1071 Specified key was too long问题

在执行php artisan admin:install命令安装laravel-admin的时候&#xff0c;如果你使用的数据库是MySQL v5.7.7以下版本就会报下面的错&#xff1a; SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key length is 1000 bytes (SQL:…...

【Python---六大数据结构】

&#x1f680; 作者 &#xff1a;“码上有前” &#x1f680; 文章简介 &#xff1a;Python &#x1f680; 欢迎小伙伴们 点赞&#x1f44d;、收藏⭐、留言&#x1f4ac; Python---六大数据结构 往期内容前言概述一下可变与不可变 Number四种不同的数值类型Number类型的创建i…...

一个简短的补充------对链表练习题的补充补充

昨天不是写了一篇有关链表的数据结构练习题嘛&#xff0c;其实那篇文章的第二道题还有许多值得我们思考的东西&#xff0c;今天就在这做一个简短的补充。补充一下运用那道题解决另一道题。 给大家看一下绿色让眼睛放松一下。 给定一个链表的头节点 head &#xff0c;返回链表…...

Spring最新核心高频面试题(持续更新)

1 什么是Spring框架 Spring框架是一个开源的Java应用程序开发框架&#xff0c;它提供了很多工具和功能&#xff0c;可以帮助开发者更快地构建企业级应用程序。通过使用Spring框架&#xff0c;开发者可以更加轻松地开发Java应用程序&#xff0c;并且可以更加灵活地组织和管理应…...

[计网底层小探索]:实现并部署多线程并发Tcp服务器框架(基于生产者消费者模型的线程池结构)

文章目录 一.网络层与传输层协议sockaddr结构体继承体系(Linux体系)贯穿计算机系统的网络通信架构图示: 二.实现并部署多线程并发Tcp服务器框架线程池模块序列化反序列化工具模块通信信道建立模块服务器主体模块任务回调模块(根据具体应用场景可重构)Tips:DebugC代码过程中遇到…...

Spring Boot 笔记 020 redis集成

1.1 安装redis Windows 下 Redis 安装与配置 教程_redis windows-CSDN博客 2.1 引入redis坐标 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId></dependency> 2.2 配置…...

防火墙——计算机网络

前述基于密码的安全机制不能有效解决以下安全问题&#xff1a; 用户入侵&#xff1a; 利用系统漏洞进行未授权登录&#xff1b; 授权用户非法获取更高级别权限等。 软件入侵&#xff1a; 通过网络传播病毒、蠕虫和特洛伊木马。 拒绝服务攻击等。 解决方法&#xff1a; 防火墙&a…...

用html编写的招聘简历

用html编写的招聘简历 相关代码 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</tit…...

215数组中的第K个最大元素

215数组中的第K个最大元素 题目描述 给定整数数组 nums 和整数 k&#xff0c;请返回数组中第 k 个最大的元素。 请注意&#xff0c;你需要找的是数组排序后的第 k 个最大的元素&#xff0c;而不是第 k 个不同的元素。 你必须设计并实现时间复杂度为 O(n) 的算法解决此问题。…...

【动态规划】【矩阵快速幂】LeetCode2851. 字符串转换

作者推荐 【深度优先搜索】【树】【有向图】【推荐】685. 冗余连接 II 涉及知识点 【矩阵快速幂】封装类及测试用例及样例 LeetCode 2851. 字符串转换 给你两个长度都为 n 的字符串 s 和 t 。你可以对字符串 s 执行以下操作&#xff1a; 将 s 长度为 l &#xff08;0 <…...

阿博图书馆管理系统信息管理系统源码-SpringBoot后端+Vue前端+MySQL【可直接运行】

&#x1f4a1;实话实说&#xff1a;用最专业的技术、最实惠的价格、最真诚的态度服务大家。无论最终合作与否&#xff0c;咱们都是朋友&#xff0c;能帮的地方我绝不含糊。买卖不成仁义在&#xff0c;这就是我的做人原则。摘要 在信息化时代背景下&#xff0c;图书馆作为知识传…...

Qt多线程数据库操作:安全分离连接,彻底解决段错误

在 Qt 开发中&#xff0c;数据库操作与多线程的搭配是一个经典难题。许多开发者都曾遇到过这样的诡异现象&#xff1a;程序运行一段时间后突然崩溃&#xff0c;堆栈指向数据库操作&#xff0c;但代码逻辑明明正确。真相只有一个——数据库连接被多个线程共享了。本文结合真实项…...

从STFT到ISTFT:窗函数、填充与流式处理的实战指南

1. 窗函数一致性&#xff1a;信号重建的隐形守护者 第一次用STFT处理语音信号时&#xff0c;我踩过一个典型坑&#xff1a;用汉宁窗做分析&#xff0c;却忘了在重建时指定相同窗函数。结果重建后的语音像被掐着脖子说话&#xff0c;高频部分全是毛刺。这个教训让我明白&#xf…...

fSpy完全上手指南:从基础到实战的零门槛教程

fSpy完全上手指南&#xff1a;从基础到实战的零门槛教程 【免费下载链接】fSpy A cross platform app for quick and easy still image camera matching 项目地址: https://gitcode.com/gh_mirrors/fs/fSpy 当你需要将一张普通的2D照片转换为精确的3D场景时&#xff0c;…...

给嵌入式开发者的英飞凌HSM实战指南:从AUTOSAR集成到密钥安全存储

英飞凌HSM深度实战&#xff1a;AUTOSAR集成与密钥管理全解析 在汽车电子领域&#xff0c;安全性能已经从"加分项"变成了"必选项"。想象一下&#xff0c;当一辆智能汽车以120公里时速行驶时&#xff0c;任何微小的安全漏洞都可能导致灾难性后果。这正是英飞…...

保姆级教程:在OpenEuler 22.03 LTS-SP4上,用cephadm搞定Ceph Pacific集群部署

在OpenEuler 22.03 LTS-SP4上部署Ceph Pacific集群的完整指南 OpenEuler作为国产操作系统的代表&#xff0c;凭借其高性能和安全性&#xff0c;正逐渐成为企业级应用的首选。而Ceph作为开源的分布式存储解决方案&#xff0c;以其高可靠性和可扩展性赢得了广泛认可。本文将详细介…...

避坑指南:Windows系统下WampServer2.2e与MySQL5.5.24的完美兼容配置

避坑指南&#xff1a;Windows系统下WampServer2.2e与MySQL5.5.24的完美兼容配置 在本地开发环境中&#xff0c;WampServer因其便捷的一键式部署深受开发者喜爱。但当系统已存在其他MySQL服务时&#xff0c;端口冲突问题往往让新手束手无策。本文将深入解决WampServer2.2e与既有…...

ProfControl V8的介绍 组合成为模板

作者&#xff1a;刘凌波链接&#xff1a;环野电子, profcontrolhttp://oa.profcontrol.cn/teaching_V8-7926f783c6.html来源&#xff1a;ProfControl组合为模版1、按下SHIFT键&#xff0c;在地图区域空白处按下鼠标左键不松开&#xff0c;移动鼠标则进入框选模式&#xff0c;让…...

大三下期末突击指南:从编译原理到大数据,这6门课我是怎么一周内搞定的

大三下期末突击指南&#xff1a;从编译原理到大数据&#xff0c;这6门课我是怎么一周内搞定的 距离期末考试只剩一周&#xff0c;面对算法分析、编译原理、嵌入式这些硬核课程&#xff0c;你是不是已经开始焦虑了&#xff1f;别担心&#xff0c;去年我也经历过同样的困境。通过…...

10分钟掌握Deep-Live-Cam:从零搭建实时AI换脸系统的完整指南

10分钟掌握Deep-Live-Cam&#xff1a;从零搭建实时AI换脸系统的完整指南 【免费下载链接】Deep-Live-Cam real time face swap and one-click video deepfake with only a single image 项目地址: https://gitcode.com/GitHub_Trending/de/Deep-Live-Cam Deep-Live-Cam是…...