一、场景
在js中一个对象(Object)或者是一个数组(Array)在复制的过程中往往不是特别的简单,一般情况下我们会直接将其赋值给另外一个变量名下,就像这样:
var a = [1,2,3]; var b = a; b.push(4); console.log(a); // [1,2,3,4]
但是很显然这样的话,只是把原来的数组引用了,实际上两个变量下用的还是同一个数组,所以如果我们想复制出来一个新的数组的话就不能这样,对象也是一样;
二、关于数组(Array)
对于数组来说要想复制一个新的出来,其实es6已经给出了几个方法:
//三个点 let a = [1,2,3,4,5]; let b = [...a]; a.push(666); console.log(a); //[1,2,3,4,5,666] console.log(b);// [1,2,3,4,5] //Array.from() let a = [1,2,3,4,5]; let b = Array.from(a); a.push(666); console.log(a); //[1,2,3,4,5,666] console.log(b);// [1,2,3,4,5]
如果是es5的话也有js的实现方法,最笨的方法就是遍历这个数组来复制,这里不再赘述,另外有一个小技巧还不错:
var a=[1,2,3,4,5]; var b=a; var c=[].concat(a); a.push(666); console.log(a); console.log(b);
二、关于对象(Object)
我认为对于对象来说最简单的深拷贝方法就是转成字符串再解析:
var obj = {a:1,b:2} var newObj = JSON.parse(JSON.stringify(obj)); newObj.a=3; console.log(obj);
es6也有一种简单的方法可以copy对象(Object.assign),不过貌似还是浅copy。
另外一种深拷贝方法:递归遍历
var obj = {a:{b:10}}; function deepCopy(obj){ if ( typeof obj != 'object' ){ // ( obj instanceof Object || obj instanceof Array ) return obj; } var newobj = {}; for ( var attr in obj) { newobj[attr] = deepCopy(obj[attr]); } return newobj; } var obj2 = deepCopy(obj); obj2.a.b = 20; alert(obj.a.b); //10