理解js浅拷贝和深拷贝
理解深拷贝和浅拷贝之前先了解下js中的基本类型和引用类型
1、基本类型:
在js中,数据的基本类型undefined,null,string,number,boolean,在变量中赋的实际值,基本类型就是简单的数据段。
基本类型的值是不可以改变的
var a = 1;
var b = a;
a++;
console.log(a); //2
console.log(b); //1
这里a和b是独立的,当改变a或b,其另外一个值不会随之改变
2、引用类型:
在js中,数据的引用类型object,Array,RegExp,date,function,在变量中赋的实际值
引用类型的值是可以改变的
var arr = [1,2,3,4,5];
var arr2 = arr;
arr[0] = 2;
console.log(arr); //[2、2、3、4、5]
console.log(arr2);//[2、2、3、4、5]
这里在改变arr[0]中的值后,arr2数据也跟着改变,引用类型在赋值的时候(arr2=arr),其实在栈内存中添加了arr2,但是堆内存中还是[1,2,3,4,5],通俗点讲就是引用类型赋值并非真正意义上的数据赋值,而是在栈内存中添加一个指针,还是指向堆内存中的[1,2,3,4,5],只添加栈内存的指针

好,到这里我们在讨论深拷贝和浅拷贝,深拷贝顾名思义是在数据是相互独立的,改数据而另一个不受影响,浅拷贝则是数据会随之改变而改变。
这么一看,基本类型不正好是嘛,数据都是相互独立的,乍看好像还真是的。
但是,但是,我们所说的深拷贝必须要在复杂的object类型下,基本类型里没有object,那么只能是引用类型。
再来看个例子:
var arr3 = [[1,2],3,4,5];
var arr4 = arr3;
arr3[0][1] = 3;
console.log(arr3); //[[1,3],3,4,5]
console.log(arr4); //[[1,3],3,4,5]
明明改了arr3,为何arr4也改了,这不是我想要的,那如何独立呢,你会发现使用什么for循环,slice,concat是根本不管用的,网上有其他的坑,在此我就不多说了,直接说解决办法
方法1、JSON
利用JSON.stringify和JSON.parse
var arr3 = [[1,2],3,4,5];
var arr4 = JSON.parse(JSON.stringify(arr3));
arr3[0][1] = 3;
console.log(arr3); //[[1,3],3,4,5]
console.log(arr4); //[[1,2],3,4,5]
但是这种方法有个小弊端,就是值不能为undefined或null,最好对数据提前判断
方法2、jq $.extend
$.extend([deep],target,object1[,objextN]); //deep 值为true或false,true为深拷贝,false为浅拷贝。target 目标对象,其他对象的成员属性将被附加到该对象上 object1/objextN 是需要被操作的对象,可以是多个,这里是例子中的arr3
var arr3 = [[1,2],3,4,5];
var arr4 = $.extend(true,[],arr3);
arr3[0][1] = 3;
console.log(arr3); //[[1,3],3,4,5]
console.log(arr4); //[[1,2],3,4,5]
以上就是介绍的两种方法
理解js浅拷贝和深拷贝的更多相关文章
- 关于js浅拷贝与深拷贝的理解
前端开发中,一般情况下,很少会去在意深拷贝与浅拷贝的关系. 大家知道,js变量有2种数据类型:基本类型和引用类型.基本类型的拷贝是将整个值完全拷贝一份的,也就是深拷贝.就是开辟了新的堆内存.所以基本类 ...
- JS - 浅拷贝与深拷贝的理解以及简单实现方法
前几天撸项目代码时, 由一个技术点间接牵扯出了这东西. 所以就来总结一下. 深拷贝 拷贝对象每个层级的属性. 作用的对象是 js中引用类型的对象,基本类型没有涉及. 本质上将引用类型的对象在堆上重新开 ...
- 一篇文章理解JS数据类型、深拷贝和浅拷贝
前言 笔者最近整理了一些前端技术文章,如果有兴趣可以参考这里:muwoo blogs.接下来我们进入正片: js 数据类型 六种 基本数据类型: Boolean. 布尔值,true 和 false. ...
- 关于JS浅拷贝和深拷贝
在 JS 中有一些基本类型像是Number.String.Boolean,而对象就是像这样的东西{ name: 'Larry', skill: 'Node.js' },对象跟基本类型最大的不同就在于他 ...
- js 浅拷贝和深拷贝
传值与传址 了解了基本数据类型与引用类型的区别之后,我们就应该能明白传值与传址的区别了.在我们进行赋值操作的时候,基本数据类型的赋值(=)是在内存中新开辟一段栈内存,然后再把再将值赋值到新的栈中.例如 ...
- 我的Python学习笔记(二):浅拷贝和深拷贝
在Python中,对象赋值,拷贝(浅拷贝和深拷贝)之间是有差异的,我们通过下列代码来介绍其区别 一.对象赋值 对象赋值不会复制对象,它只会复制一个对象引用,不会开辟新的内存空间 如下例所示,将test ...
- JS 对象的深拷贝和浅拷贝
转载于原文:https://www.cnblogs.com/dabingqi/p/8502932.html 这篇文章是转载于上面的链接地址,觉得写的非常好,所以收藏了,感谢原创作者的分享. 浅拷贝和深 ...
- Javascript/js 的浅拷贝与深拷贝(复制)学习随笔
js变量的数据类型值分基本类型值和引用类型值. 在ES6(ECMAScript6)以前,基本数据类型包括String.Number.Boolean.Undefined.Null. 基本类型值的复制(拷 ...
- js中浅拷贝和深拷贝以及深拷贝的实现
前言:2019年的第一篇分享... 一.什么是基本类型值和引用类型值?ECMAScript包括两个不同类型的值:基本数据类型和引用数据类型.基本数据类型指的是简单的数据段,引用数据类型指的是有多个值构 ...
随机推荐
- RedisEclipse
1.Eclipse配置 2.HelloWorld import redis.clients.jedis.Jedis; public class TestPing { public static voi ...
- impala语句
0.保留两位小数 round(字段a, 需要保留几位小数) round( data, 4) 1. case wen case when 字段a = '01' and 字段b = '01' and 字段 ...
- 下载器Folx怎么安装使用
应该使用哪个下载工具?这个如果是Windows上会有无数答案的问题,在Mac上却变得异常的纠结.比如Leech和Aria2,这两款软件,前者功能相对比较简单,后者的配置又稍微有点复杂,很难找到一款相对 ...
- guitar pro系列教程(十四):Guitar Pro教程之创建新乐谱后的设置
前面的章节我们有对Guitar Pro的单个功能作介绍,对于初学作曲,且又是吉他初学者的朋友们来说,学完这些功能介绍,自己还不能融会贯通起来,创建了一个新的乐谱后,但是看起来还不是很满意,今天我们就创 ...
- 【PYTEST】第四章Fixture
知识点: 利用fixture共享数据 conftest.py共享fixture 使用多个fixture fixture作用范围 usefixture 重命名 1. 利用fixture共享数据 test ...
- git学习与应用
git是什么 Git是一个开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目:同类的有svn,如果知道svn是干嘛的(上篇),那么git是啥就不多解释了. Git 与常用的版本控制工具 C ...
- C语言讲义——内存管理
动态分配内存 动态分配内存,在堆(heap)中分配. void *malloc(unsigned int num_bytes); 头文件 stdlib.h或malloc.h 向系统申请分配size个字 ...
- uniapp分包(详尽版)
PS:本文是笔者对基于uniapp的一小程序项目进行分包后的复盘文档,不足之处请多多指教. 一:分包相关概念 本质上是改变项目的路由以及优化项目各个模块的启动时间的一种优化技术. 主包与分包的概念 1 ...
- redis-cli 持久化,复制,哨兵,事务,流水线
一.持久化: 快照文件RDB 保存"开始"创建新快照一刻的内存快照,创建过程的内存变化不会被记录 创建快照的办法有几种 1.客户端可以通过想Redis发送BGSAVE来创建一个快照 ...
- MindSpore手写数字识别初体验,深度学习也没那么神秘嘛
摘要:想了解深度学习却又无从下手,不如从手写数字识别模型训练开始吧! 深度学习作为机器学习分支之一,应用日益广泛.语音识别.自动机器翻译.即时视觉翻译.刷脸支付.人脸考勤--不知不觉,深度学习已经渗入 ...