javascript 数组的深浅拷贝
2017-11-19 09:41
691 查看
一、浅拷贝
用 = 来复制
我们会发现,改变数组arr2的值,arr1也跟着变了。
二、深拷贝
1.数组元素是基本类型(字符串、数值、布尔、null、undefined)
a.利用数组提供的slice或者concat方法。
我们会发现改变某个数组中的值时,不会对其他数组产生影响。
b.扩展运算符(ES6新增 结合数组使用,把数组的元素用逗号分隔开来,组成一个序列。)
2.数组元素是对象或者数组时
用过用concat我们会发现,改变其中一个数组中对象或数组的值时,另一个数组也变了。(用slice或者扩展运算符是一样的)
所以,我们需要用另一种方法——借用JSON对象的方法stringfy()和parse()。(注:JSON.stringfy():把js对象序列化为json字符串;JSON.parse():把json字符串解析为原生js值)
关于数组的拷贝就到这里了,以后有新的思绪再补充。
用 = 来复制
var arr1 = [1,2,3,4]; var arr2 = arr1; console.log(arr1);//[1,2,3,4] console.log(arr2);//[1,2,3,4] arr2[0]=6; console.log(arr1);//[6,2,3,4] console.log(arr2);//[6,2,3,4]
我们会发现,改变数组arr2的值,arr1也跟着变了。
二、深拷贝
1.数组元素是基本类型(字符串、数值、布尔、null、undefined)
a.利用数组提供的slice或者concat方法。
var arr1 = ['old',1,true,null,undefined]; var arr2 = arr1.concat(); var arr3 = arr1.slice(); console.log(arr1); //['old',1,true,null,undefined] console.log(arr2); //['old',1,true,null,undefined] console.log(arr3); //['old',1,true,null,undefined] arr1[0]='new'; arr2[2]=false; console.log(arr1); //['new',1,true,null,undefined] console.log(arr2); //['old',1,false,null,undefined] console.log(arr3); //['old',1,true,null,undefined]
我们会发现改变某个数组中的值时,不会对其他数组产生影响。
b.扩展运算符(ES6新增 结合数组使用,把数组的元素用逗号分隔开来,组成一个序列。)
var arr1 = ['old',1,true,null,undefined]; var [...arr2] = arr1; console.log(arr1); //["old", 1, true, null, undefined] console.log(arr2); //["old", 1, true, null, undefined] arr1[0]='new'; console.log(arr1); //["new", 1, true, null, undefined] console.log(arr2); //["old", 1, true, null, undefined]我们会发现改变某个数组中的值时,也不会对其他数组产生影响。
2.数组元素是对象或者数组时
用过用concat我们会发现,改变其中一个数组中对象或数组的值时,另一个数组也变了。(用slice或者扩展运算符是一样的)
var arr1 = [{name: '张三'}, [1,2,3],1]; var arr2 = arr1.concat(); //这里没有console.log是因为输出对象值,查看的时候会显示最后的引用(console是浏览器提供的,不是ECMA提供的,不同浏览器实现可能不一样,chrome的实现是异步的) arr1[0].name = '李四'; arr1[1][0] = 5; arr1[2]=7; console.log(arr1); // [{name: '李四'}, [5,2,3],7] console.log(arr2); // [{name: '李四'}, [5,2,3],1]
所以,我们需要用另一种方法——借用JSON对象的方法stringfy()和parse()。(注:JSON.stringfy():把js对象序列化为json字符串;JSON.parse():把json字符串解析为原生js值)
var arr1 = [{name: '张三'}, [1,2,3],1]; var arr2 = JSON.parse(JSON.stringify(arr1)); arr1[0].name = '李四'; arr1[1][0] = 5; arr1[2]=7; console.log(arr1); // [{name: '李四'}, [5,2,3],7] console.log(arr2); // [{name: '张三'}, [1,2,3],1]
关于数组的拷贝就到这里了,以后有新的思绪再补充。
相关文章推荐
- Javascript小知识点(七):数据类型赋值,浅拷贝,深拷贝(数组值传递还是引用传递)
- js实现数组和对象的深浅拷贝
- JavaScript 数组对象深拷贝与浅拷贝
- 数组的深浅拷贝
- ActionScript3中关于数组深浅拷贝的问题
- JavaScript之深浅拷贝
- javascript关于对象深拷贝和数组去重的问题...
- javascript数组操作(创建、元素删除、数组的拷贝)
- 如何深浅拷贝数组
- JavaScript 深浅拷贝
- js 数组的深浅拷贝
- javascript 数组以及对象的深拷贝(复制数组或复制对象)的方法
- javascript深度拷贝和数组去重代码详解; 数组,类数组,try-catch方法介绍
- JavaScript数组深拷贝和浅拷贝的两种方法
- javascript高逼格代码实现数组去重,JSON深度拷贝,匿名函数自执行,数字取整等
- 深入理解 JavaScript 对象和数组拷贝
- JavaScript深拷贝和浅拷贝数组
- javascript中的深浅拷贝
- javascript深浅拷贝
- Javascript中数据类型&深浅拷贝二