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

【js】js中深拷贝与浅拷贝:

文章目录

        • 一、浅拷贝(修改新对象会改到原对象)
            • 【1】通过= 直接赋值
            • 【2】Object.assign()方法
        • 二、深拷贝(修改新对象不会改到原对象)
            • 【1】通过JSON对象来实现深拷贝
            • 【2】 Object.create()方法
            • 【3】使用扩展运算符实现深拷贝
        • 三、要点:


一、浅拷贝(修改新对象会改到原对象)

只复制指向某个对象的指针,而不复制对象本身,新旧对象还是共享同一块内存,修改新对象会改到原对象

【1】通过= 直接赋值
var obj1 = {name: '诸葛亮',gender: '男',age: 20
};
var obj2 = obj1;obj2.age = 30;
console.log(obj2);  //name: '诸葛亮', gender: '男', age: 30
console.log(obj1);  //name: '诸葛亮', gender: '男', age: 30
【2】Object.assign()方法
var obj1 = {name: '诸葛亮',gender: '男',age: 20
};
var obj2=Object.assign(obj1)obj2.age = 30;
console.log(obj2.age);  // age: 30
console.log(obj1.age);  // age: 30 

二、深拷贝(修改新对象不会改到原对象)

会另外创造一个一模一样的对象,新对象跟原对象不共享内存,修改新对象不会改到原对象

【1】通过JSON对象来实现深拷贝

JSON.stringify() 方法将一个 JavaScript 值(对象或者数组)转换为一个 JSON 字符串。
JSON.parse() 方法用来解析JSON字符串,构造由字符串描述的JavaScript值或对象。返回值为Object 类型, 对应给定 JSON 文本的对象/值。
该方法的原理是先将引用类型的对象转换为基础类型的字符串,然后将其从字符串再重新转换为对应的引用类型对象,在进行转换为引用对象的时候,会为对象的每个属性重新分配堆内存,即进行了深拷贝

var obj3 = {number: 1111,city: '西安'
}
var obj4 = JSON.parse(JSON.stringify(obj3));obj4.city = '深圳';
console.log(obj3.city);  //'西安'
console.log(obj4.city);  //'深圳'
【2】 Object.create()方法
var obj3 = {number: 1111,city: '杭州'
}
var obj4 = Object.create(obj3)obj4.city = '深圳';
console.log(obj3.city);  //'杭州'
console.log(obj4.city);  //'深圳'
【3】使用扩展运算符实现深拷贝

// 当value是基本数据类型,比如String,Number,Boolean时,是可以使用拓展运算符进行深拷贝
// 当value是引用类型的值,比如Object,Array,引用类型进行深拷贝也只是拷贝了引用地址,所以属于浅拷贝

var obj3 = {number: 1111,city: '杭州'
}
var obj4 = { ...obj3, number: 2021 }console.log(obj3.number);  //1111
console.log(obj4.number);  //2021

三、要点:

深浅拷贝,都是进行复制,那么区别主要在于复制出来的新对象和原来的对象是否会互相影响,改一个,另一个也会变。
新旧对象共享内存,修改其中一个则会影响另外一个,则为浅拷贝
新旧对象不共享内存,修改其中一个不会影响另一个,则为深拷贝

相关文章:

【js】js中深拷贝与浅拷贝:

文章目录 一、浅拷贝(修改新对象会改到原对象)【1】通过 直接赋值【2】Object.assign()方法 二、深拷贝(修改新对象不会改到原对象)【1】通过JSON对象来实现深拷贝【2】 Object.create(&#xf…...

大文件上传demo,前端基于Uppy,后端基于koa

前言 文件上传基本上所有的管理系统之类的项目都有这么一个功能。因为使用了Element,可以方便的使用 其提供的Upload组件,对于普通上传来说基本上就够用了。但是有时候会涉及到大文件上传的需求,这时就会面临一些问题:比如文件上…...

typeScript--[函数定义]

一.TypesScript 函数的定义 函数的定义包括两种类型:函数声明和函数表达式。 1.函数声明 function hello(): string {return "hello" } 2.函数表达式 var hello1 function (): string {return "hello" } 二.函数之可选参数 参数后面的限…...

Spring初始化项目

1、官网用法 访问地址:https://start.spring.io idea配置:https://start.spring.io 2、阿里巴巴加速 访问地址:https://start.aliyun.com/bootstrap.html idea配置:https://start.aliyun.com 3、区别 官网阿里巴巴版本最新稍…...

Opencv 图像金字塔----高斯和拉普拉斯

原文:图像金字塔----高斯和拉普拉斯 图像金字塔是图像中多尺度表达的一种,最初用于机器视觉和图像压缩,最主要用于图像的分割、融合。 高斯金字塔 ( Gaussian pyramid): 高斯金字塔是由底部的最大分辨率图像逐次向下采样得到的一系列图像…...

gitLab(git)误提交命令

1.先使用下面命令查看一下分支上已提交的信息 git log 2.回退到之前的版本 git reset —hard 你要删除的提交哈希码(一般是离这个命令最近的一串数字) 3.覆盖掉远端的版本信息,使远端的仓库也回退到相应的版本 注意:切换到你提…...

Rust个人学习笔记2

一定要牢记Rust是基于表达式的语言&#xff0c;除了声明语句和表达式语句外&#xff0c;其他的都是表达式。所以if也是表达式&#xff0c;它可以被用作右值。 条件控制 if-else。cpp和python得结合。 fn main() {let number 34;if number < 0 {println!("number &l…...

深入浅出Android同步屏障机制

原文链接 Android Sync Barrier机制 诡异的假死问题 前段时间&#xff0c;项目上遇到了一个假死问题&#xff0c;随机出现&#xff0c;无固定复现规律&#xff0c;大量频繁随机操作后&#xff0c;便会出现假死&#xff0c;整个应用无法操作&#xff0c;不会响应事件&#xff…...

工程管理系统简介 工程管理系统源码 java工程管理系统 工程管理系统功能设计

鸿鹄工程项目管理系统 Spring CloudSpring BootMybatisVueElementUI前后端分离构建工程项目管理系统 1. 项目背景 一、随着公司的快速发展&#xff0c;企业人员和经营规模不断壮大。为了提高工程管理效率、减轻劳动强度、提高信息处理速度和准确性&#xff0c;公司对内部工程管…...

Python 专栏目录索引

文章目录 Python 环境搭建Python 语法 变量、print、注释和运算符Python 的基本结构Python 中的文件和文件夹操作Python 中常用库Python 常见问题及解决方案Python 应用实例 Python 环境搭建 vscode搭建Python环境 Python 语法 变量、print、注释和运算符 python语法 变量、…...

SSM学习

技术架构 crm的技术架构: 视图层(view):展示数据&#xff0c;跟用户交互。 html, css,js,jquery,bootstrap(ext / easyUI),jsp控制层(Controller):控制业客处理流程(接收请求,接收参数,封装参数;根据不同的请求调用业务 (servlet, ) springMVC ( , webwork,strutsl,struts2)业…...

.net项目部署Docker

1、项目生成的bin目录下创建Dockerfile文件 #运行环境描述&#xff0c;此处是用的Net5构建镜像 FROM mcr.microsoft.com/dotnet/sdk:6.0 AS build #复制文件到 docker容器中的app文件夹中 COPY . /app #设置工作目录为 app 文件夹&#xff0c;要和上面一致哦 WORKDIR /app #设…...

Ubuntu无法加载exfat的USB存储设备

当接入设备USB存储设备提示&#xff1a; 不能挂在63GB 卷 Error mounting /dev/sdb1 at /media/ubuntu/83C9-26F4: Command-line mount -t "exfat" -o "uhelperudisks2,nodev,nosuid,uid1000,gid1000,iocharsetutf8,namecase0,errorsremount-ro,umask0077"…...

【计算机网络】网络编程接口 Socket API 解读(2)

Socket 是网络协议栈暴露给编程人员的 API&#xff0c;相比复杂的计算机网络协议&#xff0c;API 对关键操作和配置数据进行了抽象&#xff0c;简化了程序编程。 本文讲述的 socket 内容源自 Linux 发行版 centos 9 上的 man 工具&#xff0c;和其他平台&#xff08;比如 os-x …...

【黄啊码】PHP如何防止重复提交

防抖&#xff08;Debounce&#xff09;是一种防止重复提交的策略&#xff0c;它通过延迟一定时间来合并连续的操作&#xff0c;以确保只执行一次。 以下是几种防抖的实现方法以及对应的代码示例&#xff1a; 1. 前端 JavaScript 实现&#xff1a; 在前端使用 JavaScript 实现…...

2594. 修车的最少时间

文章目录 Tag题目来源题目解读解题思路方法一&#xff1a;二分枚举答案 写在最后 Tag 【二分枚举答案】【数组】 题目来源 2594. 修车的最少时间 题目解读 给你一个表示机械工能力的数组 ranks&#xff0c;ranks[i] 表示第 i 位机械工可以在 r a n k s [ i ] ∗ n 2 ranks[…...

vue 使用qrcode生成二维码并可下载保存

安装qrcode npm install qrcode --save代码 <template><div style"display: flex; flex-direction: column; align-items: center; justify-content center;"><div>查看溯源码&#xff0c;<a id"saveLink" style"text-decorati…...

网络融合的发展思路

虽然移动和固定网的融合代表了下一代网络的发展方向&#xff0c;但是目前移动和固定网的 发展还是独立的&#xff0c;有着各自的演进方式&#xff0c;要实现两个网络的完全融合是一个长期 的、逐步发展的过程。 网络融合的体系结构首先应坚持网络分层和功能分离的原则&#…...

报考浙江工业大学MBA项目如何选择合适的辅导班?

浙江工业大学MBA项目每年有数百人报考&#xff0c;在浙江省内除了浙大以外算是人数比较多的一个项目。2023级的招生中第一志愿也通过复试刷掉了百来人&#xff0c;在省内其实作为第一志愿报考的风险在逐渐增大&#xff0c;考生们如果坚持报考&#xff0c;则在针对联考初试的备考…...

算法训练第五十八天

总结&#xff1a;今日事单调栈的开端&#xff0c;还是挺巧妙的。 496. 下一个更大元素 I - 力扣&#xff08;LeetCode&#xff09; 代码&#xff1a; class Solution { public:vector<int> nextGreaterElement(vector<int>& nums1, vector<int>& …...

springboot 百货中心供应链管理系统小程序

一、前言 随着我国经济迅速发展&#xff0c;人们对手机的需求越来越大&#xff0c;各种手机软件也都在被广泛应用&#xff0c;但是对于手机进行数据信息管理&#xff0c;对于手机的各种软件也是备受用户的喜爱&#xff0c;百货中心供应链管理系统被用户普遍使用&#xff0c;为方…...

应用升级/灾备测试时使用guarantee 闪回点迅速回退

1.场景 应用要升级,当升级失败时,数据库回退到升级前. 要测试系统,测试完成后,数据库要回退到测试前。 相对于RMAN恢复需要很长时间&#xff0c; 数据库闪回只需要几分钟。 2.技术实现 数据库设置 2个db_recovery参数 创建guarantee闪回点&#xff0c;不需要开启数据库闪回。…...

Frozen-Flask :将 Flask 应用“冻结”为静态文件

Frozen-Flask 是一个用于将 Flask 应用“冻结”为静态文件的 Python 扩展。它的核心用途是&#xff1a;将一个 Flask Web 应用生成成纯静态 HTML 文件&#xff0c;从而可以部署到静态网站托管服务上&#xff0c;如 GitHub Pages、Netlify 或任何支持静态文件的网站服务器。 &am…...

python如何将word的doc另存为docx

将 DOCX 文件另存为 DOCX 格式&#xff08;Python 实现&#xff09; 在 Python 中&#xff0c;你可以使用 python-docx 库来操作 Word 文档。不过需要注意的是&#xff0c;.doc 是旧的 Word 格式&#xff0c;而 .docx 是新的基于 XML 的格式。python-docx 只能处理 .docx 格式…...

leetcodeSQL解题:3564. 季节性销售分析

leetcodeSQL解题&#xff1a;3564. 季节性销售分析 题目&#xff1a; 表&#xff1a;sales ---------------------- | Column Name | Type | ---------------------- | sale_id | int | | product_id | int | | sale_date | date | | quantity | int | | price | decimal | -…...

pikachu靶场通关笔记22-1 SQL注入05-1-insert注入(报错法)

目录 一、SQL注入 二、insert注入 三、报错型注入 四、updatexml函数 五、源码审计 六、insert渗透实战 1、渗透准备 2、获取数据库名database 3、获取表名table 4、获取列名column 5、获取字段 本系列为通过《pikachu靶场通关笔记》的SQL注入关卡(共10关&#xff0…...

有限自动机到正规文法转换器v1.0

1 项目简介 这是一个功能强大的有限自动机&#xff08;Finite Automaton, FA&#xff09;到正规文法&#xff08;Regular Grammar&#xff09;转换器&#xff0c;它配备了一个直观且完整的图形用户界面&#xff0c;使用户能够轻松地进行操作和观察。该程序基于编译原理中的经典…...

佰力博科技与您探讨热释电测量的几种方法

热释电的测量主要涉及热释电系数的测定&#xff0c;这是表征热释电材料性能的重要参数。热释电系数的测量方法主要包括静态法、动态法和积分电荷法。其中&#xff0c;积分电荷法最为常用&#xff0c;其原理是通过测量在电容器上积累的热释电电荷&#xff0c;从而确定热释电系数…...

Netty从入门到进阶(二)

二、Netty入门 1. 概述 1.1 Netty是什么 Netty is an asynchronous event-driven network application framework for rapid development of maintainable high performance protocol servers & clients. Netty是一个异步的、基于事件驱动的网络应用框架&#xff0c;用于…...

【从零学习JVM|第三篇】类的生命周期(高频面试题)

前言&#xff1a; 在Java编程中&#xff0c;类的生命周期是指类从被加载到内存中开始&#xff0c;到被卸载出内存为止的整个过程。了解类的生命周期对于理解Java程序的运行机制以及性能优化非常重要。本文会深入探寻类的生命周期&#xff0c;让读者对此有深刻印象。 目录 ​…...