管是在面试中还是我们的项目中经常会用到数组或者对象的深拷贝,下面我就自己总结的分享给大家。

首先要知道什么是深拷贝?什么是浅拷贝?

深拷贝:源对象与拷贝对象互相独立,其中任何一个对象的改动都不会对另外一个对象造成影响。

浅拷贝:拷贝出来的目标对象的指针和源对象的指针指向的内存空间是同一块空间。

1、对象(object)的深拷贝和浅拷贝:

  1.1对象的浅拷贝:

 var a={x:,y:};
var b=a;
a.x=;
console.log(a); //=>Object {x: 2, y: 0}
console.log(b); //=>Object {x: 2, y: 0}

1.2对象的深拷贝的几种方法:

  方法1:利用JSON.parse();

var obj1={x:,y:};
var obj2=JSON.parse(JSON.stringify(obj1));
obj1.x=;
console.log(obj1); //=>Object {x: 2, y: 0}
console.log(obj2); //=>Object {x: 0, y: 0}

方法2:es6中的Object.assign();

var obj1={x:,y:};
var obj2=Object.assign({},obj1);
obj1.x=;
console.log(obj1);//=>Object {x: 2, y: 1}
console.log(obj2);//=>Object {x: 1, y: 1}

2、数组(Array)的深拷贝和浅拷贝:

  2.1数组的浅拷贝:

var arr1=[,,];
var arr2=arr1;
arr1.push();
console.log(arr1);//=>[1, 2, 3, 5]
console.log(arr2);//=>[1, 2, 3, 5]

   2.2数组深拷贝的几种方法:

方法一:利用slice()方法:

     var arr=[,,];
var arr2=arr.slice();
arr.push();
console.log(arr); //=>[1, 2, 3, 4]
console.log(arr2);//=>[1, 2, 3]

方法二:利用 Object.assign() 方法:

var arr=[,,];
var arr2=Object.assign([],arr);
arr.push();
console.log(arr);//=>[1, 2, 3, 4]
console.log(arr2);//=>[1, 2, 3]

方法三:数组的 concat() 方法:

var arr=[,,];
var arr2=arr.concat();
arr.push();
console.log(arr);//=>[1, 2, 3, 4]
console.log(arr2);//=>[1, 2, 3]

方法四:es6中的扩展运算符:

let arr=[,,];
let [...arr2]=arr;
arr.push();
console.log(arr);//=>[1, 2, 3, 4]
console.log(arr2);//=>[1, 2, 3]

方法五:通过遍历将值赋值

 let arr=[,,];
let arr2=arr.map((item,index)=>{
return item;
})
arr.push();
console.log(arr);//=>[1, 2, 3, 4]
console.log(arr2);//=>[1, 2, 3]

通过以上5中方法实现了数组的深拷贝,数组arr1和数组arr2相互独自,互不影响。

javascript对象和数组之 深拷贝和浅拷贝的更多相关文章

  1. 第一百零三节,JavaScript对象和数组

    JavaScript对象和数组 学习要点: 1.Object类型 2.Array类型 3.对象中的方法 什么是对象,其实就是一种类型,即引用类型.而对象的值就是引用类型的实例.在ECMAScript中 ...

  2. JavaScript 对象与数组参考大全

    http://www.cnblogs.com/meil/archive/2006/06/28/437527.html本文列举了各种JavaScript对象与数组,同时包括对上述每一对象或数组所完成工作 ...

  3. JAVA中对象的克隆及深拷贝和浅拷贝

    使用场景: 在日常的编程过程 中,经常会遇到,有一个对象OA,在某一时间点OA中已经包含了一些有效值 ,此时可能会需一个和OA完全相对的新对象OB,并且要在后面的操作中对OB的任何改动都不会影响到OA ...

  4. JavaScript中对象和数组的深拷贝

    不管是在面试中还是我们的项目中经常会用到数组或者对象的深拷贝,下面我就自己总结的分享给大家. 首先要知道什么是深拷贝?什么是浅拷贝? 深拷贝:源对象与拷贝对象互相独立,其中任何一个对象的改动都不会对另 ...

  5. 使用slice和concat对数组的深拷贝和浅拷贝

    一.数组浅拷贝 在使用JavaScript对数组进行操作的时候,我们经常需要将数组进行备份. 如下代码,如果只是简单才用赋值的方法,那么我们只要更改其中的任何一个,然后其他的也会跟着改变,这就导致了问 ...

  6. javascript中的堆栈、深拷贝和浅拷贝、闭包

    堆栈 在javascript中,堆内存是用来存放引用类型的空间环境 而栈内存,是存储基本类型和指定代码的环境 在对象中的属性名具有唯一性,数字属性名=字符串属性名,但是在测试的时候你会发现,好像所有属 ...

  7. JavaScript中面向对象的的深拷贝和浅拷贝

    理解深拷贝和浅拷贝之前需要弄懂一些基础概念,内存中存储的变量类型分为值类型和引用类型. 1.值类型赋值的存储特点, 将变量内的数据全部拷贝一份, 存储给新的变量. 例如:var num = 123 : ...

  8. JavaScript对象和数组

    1.JavaScript中有两个非常重要的数据类型是对象和数组. 通过"."或者"[]"来访问对象属性 举例:var book = { topic:" ...

  9. 简述JavaScript对象、数组对象与类数组对象

    问题引出 在上图给出的文档中,用JavaScript获取那个a标签,要用什么办法呢?相信第一反应一定是使用document.getElementsByTagName('a')[0]来获取.同样的,在使 ...

随机推荐

  1. 1.Spring Framework 5.0 入门篇

    1.为什么学习Spring? 随着对Java EE的不断接触和理解,你会发现Spring  在各个企业和项目中发挥着越来越重要的作用.掌握Spring 已成为我们IT行业生存必学的本领之一. Spri ...

  2. Java 面试知识点解析(六)——数据库篇

    前言: 在遨游了一番 Java Web 的世界之后,发现了自己的一些缺失,所以就着一篇深度好文:知名互联网公司校招 Java 开发岗面试知识点解析 ,来好好的对 Java 知识点进行复习和学习一番,大 ...

  3. JavaScript 异步开发全攻略(转)

    写了一本介绍 JavaScript 异步开发的小书: https://meathill.gitbooks.io/javascript-async-tutorial/content/ 除了比较详细的介绍 ...

  4. MongoDB中级---->关联多表查询

    http://www.linuxidc.com/Linux/2011-08/41043.htm DBRef is a more formal specification for creating re ...

  5. 通过MSSQL分析器跟踪研究EM内部行为并解决identify列问题

    今天有人问到MSSQL表里的IDENTITY字段,如何让它在复制原来数据到该表时,原来数据的IDENTITY字段不变,而新插入数据时,新插入的数据的IDENTITY依然增长,查了些资料,做了个实验,最 ...

  6. python获取日期加减之后的日期

    python语言中的datetime模块可以利用其中的方法获取不同的日期,比如获取当前日期.明天.昨天.上个月.下个月和明年.下面利用几个实例说明这些日期的获取方法,操作如下:     第一步,利用d ...

  7. error LNK2001: 无法解析的外部符号 解决方法

    错误提示:LNK2001 无法解析的外部符号 "public: class el::base::Writer & __cdecl el::base::Writer::construc ...

  8. 关于xpath相对路径前加点与不加点的区别

    转自:https://blog.csdn.net/qingmu_9923/article/details/51771602 最近在用selenium做web工程自动化测试的相关项目,会经常用到元素定位 ...

  9. B20J_2243_[SDOI2011]染色_树链剖分+线段树

    B20J_2243_[SDOI2011]染色_树链剖分+线段树 一下午净调这题了,争取晚上多做几道. 题意: 给定一棵有n个节点的无根树和m个操作,操作有2类: 1.将节点a到节点b路径上所有点都染成 ...

  10. BZOJ_3573_[Hnoi2014]米特运输_树形DP+hash

    BZOJ_3573_[Hnoi2014]米特运输_树形DP+hash 题意: 给你一棵树每个点有一个权值,要求修改最少的权值,使得每个节点的权值等于其儿子的权值和且儿子的权值都相等. 分析: 首先我们 ...