1、js的数据类型

基本概述:js的数据类型分为两种,分别为基本数据类型和引用数据类型,它们俩的区别在于基本数据类型采用值传递,引用数据类型采用指针形式传递。

如下所示:引用类型通过简单的=进行复制,会影响到原本的变量的值,因为引用的为指针,复制过去也是指针,指向同一个地址

    <script>
var obj1 = {
a: 123,
b: {
c: 233
}
};
var obj2 = {};
obj2 = obj1;
obj2.a = 111;
obj2.b = 123;
console.log(obj1);
console.log(obj2); //obj1 = obj2 = {a: 111, b: 123}
</script>
上述简单的复制也被称作:浅拷贝

2、深拷贝

概述:完整的复制一个变量,跟原有变量没有任何关联。

方式一:递归:每一层判断数据类型

    <script>
function DeepCopy(obj) {
var return_obj = {}; for (let key in obj) {
if (Object.prototype.toString.call(obj[key]) === '[Object Object]') { //判断是否为引用类型
return_obj[key] = DeepCopy(obj[key]);
} else {
return_obj[key] = {...obj[key]
}; // es6语法
} }
return return_obj;
}
var obj1 = {
a: 123,
b: {
c: 233
}
};
var obj2 = DeepCopy(obj1);
obj2.a = 0;
obj2.b = {
d: 110
};
console.log(obj1);
console.log(obj2);
</script>

方式二:JSON方法:var obj2 = JSON.parse(JSON.stringify(obj1));通过JSON的两种方法进行深拷贝

方式三:第三方库等(例子:loadash):通过.cloneDeep(obj)的方法

js相关--浅拷贝和深拷贝的更多相关文章

  1. js对象浅拷贝和深拷贝详解

    js对象浅拷贝和深拷贝详解 作者:i10630226 字体:[增加 减小] 类型:转载 时间:2016-09-05我要评论 这篇文章主要为大家详细介绍了JavaScript对象的浅拷贝和深拷贝代码,具 ...

  2. Javascript/js 的浅拷贝与深拷贝(复制)学习随笔

    js变量的数据类型值分基本类型值和引用类型值. 在ES6(ECMAScript6)以前,基本数据类型包括String.Number.Boolean.Undefined.Null. 基本类型值的复制(拷 ...

  3. js实现浅拷贝和深拷贝

    实现浅拷贝和深拷贝 1. 浅拷贝和深拷贝的区别 简单点说,浅拷贝拷贝完后,修改拷贝的内容可能会对源内容产生影响.而深拷贝就是拷贝前后的内容相互不影响.       那为什么拷贝前后的内容会相互影响呢? ...

  4. [转] js对象浅拷贝和深拷贝详解

    本文为大家分享了JavaScript对象的浅拷贝和深拷贝代码,供大家参考,具体内容如下 1.浅拷贝 拷贝就是把父对像的属性,全部拷贝给子对象. 下面这个函数,就是在做拷贝: var Chinese = ...

  5. js中浅拷贝和深拷贝以及深拷贝的实现

    前言:2019年的第一篇分享... 一.什么是基本类型值和引用类型值?ECMAScript包括两个不同类型的值:基本数据类型和引用数据类型.基本数据类型指的是简单的数据段,引用数据类型指的是有多个值构 ...

  6. js的浅拷贝和深拷贝和应用场景

    为什么会用到浅拷贝和深拷贝 首先来看一下如下代码 let a = b = 2 a = 3 console.log(a) console.log(b) let c = d = [1,2,3] let e ...

  7. 小tips:JS之浅拷贝与深拷贝

    浅拷贝: function extendCopy(p) { var c = {}; for (var i in p) { c[i] = p[i]; } return c; } 深拷贝: functio ...

  8. JS的浅拷贝与深拷贝

    浅拷贝 //这样的拷贝有一个问题.那就是,如果父对象的属性等于数组或另一个对象,//那么实际上,子对象获得的只是一个内存地址,而不是真正拷贝,因此存在父对象被篡改的可能. function exten ...

  9. js之浅拷贝与深拷贝

    浅拷贝:只会复制对象的第一层数据 深拷贝:不仅仅会复制第一层的数据,如果里面还有对象,会继续进行复制,直到复制到全是基本数据类型为止 简单来说,浅拷贝是都指向同一块内存区块,而深拷贝则是另外开辟了一块 ...

随机推荐

  1. hackme.inndy.tw的一些Writeup(5月30更新)

    hackme.inndy.tw的一些Writeup(6月3日更新) 原文链接:http://www.cnblogs.com/WangAoBo/p/7706719.html 推荐一下https://ha ...

  2. 148.CSRF攻击原理分析、防御、装饰器、中间件、IFrame以及js实现csrf攻击

    CSRF攻击概述: CSRF(Cross Site Request Forgery 跨站域请求伪造)是一种网站攻击的方式,它在2007年曾被列为互联网20大安全隐患之一.其他的安全隐患,比如SQL脚本 ...

  3. docker远程访问

    查看版本 docker version 查看信息 docker info 修改配置文件 ubuntu在 /etc/default/docker centos在/usr/lib/systemd/syst ...

  4. PHP 中 16 个魔术方法详解

    PHP 中 16 个魔术方法详解   前言 PHP中把以两个下划线__开头的方法称为魔术方法(Magic methods),这些方法在PHP中充当了举足轻重的作用. 魔术方法包括: __constru ...

  5. day18 sed

    具体功能作用: 1) 文件中添加信息的能力 (增) ok 2) 文件中删除信息的能力 (删) ok 3) 文件中修改信息的能力 (改) 4) 文件中查询信息的能力 (查) OK sed命令的语法信息 ...

  6. 解决报错Failed to start LSB: Bring up/down networking:MAC地址导致

    1.场景描述,我在电脑里装好的虚拟机,今天突然就网络无法打开,并出现如下报错: [root@ansible-control ~]# systemctl start networkJob for net ...

  7. apk 测试入门基本操作

    通过以上两个方法查询到运行的system service后,就可以在dumpsys后面加上service的名字,查看指定的service信息. // 查看Activity相关信息adb shell d ...

  8. win10下安装es

    1.安装前提 windows下已经安装好了jdk8的版本 2.下载ElasticSearch https://www.elastic.co/cn/downloads/elasticsearch#ga- ...

  9. OpenCV函数:提取轮廓相关函数使用方法

    opencv中提供findContours()函数来寻找图像中物体的轮廓,并结合drawContours()函数将找到的轮廓绘制出.首先看一下findContours(),opencv中提供了两种定义 ...

  10. HTML的链接标签

    网页的链接标签 文本超链接 图像超链接 格式:<a href="path" target="目标窗口位置" >链接文本或图像</a> 锚 ...