js深淺拷貝

摘要： 所謂的深淺拷貝是相對與typeof === 'object' 而言的，陣列是用堆對應儲存的。 淺拷貝：拷貝了物件的存放地址，只是指向相同而已 深拷貝：完全複製了一個獨立的個體 1、 淺拷貝(指向同一個存放地址) le...

所謂的深淺拷貝是相對與typeof === 'object' 而言的，陣列是用堆對應儲存的。

淺拷貝：拷貝了物件的存放地址，只是指向相同而已

深拷貝：完全複製了一個獨立的個體

1、 淺拷貝(指向同一個存放地址)

let arr1 = [1,3,5];
 let arr2 = arr1;
 arr1[0] = 10;
 console.log(arr2) // [10,3,5]

2、深拷貝

• 2.1 返回新陣列方法 slice() 、 contat()、 map()

let arr1 = [2,5,7];
let arr2 = arr1.slice(0);
let arr3 = arr1.contat();
let arr4 = arr1.map(x => x);
arr2[0] = 4;
 arr1[0] = 99;
console.log(arr1,arr2) // [99,5,7][4,5,7]

• 2.2ES6擴充套件運算子實現陣列的深拷貝

let arr = [1,3,5];
 let arr1 = [...arr];

• 2.3for-in連原型鏈也一併複製的方法

let arr = [1,3,5];
 let arr2 = [] ;
 for(var key in arr) {
arr2[key] = arr[key]
}

• 2.4 使用陣列遍歷賦值

let arr = [1,2,4];
let arr2 = [];
 arr.foreach((ele,index) =>{
arr2[index] = ele;
 })

• 2.5 多維陣列複製

let arr = [1,[1,4],5,[{name:'bobo'}]];
let arr2 =JSON.parse(JSON.stringify(arr));
console.log(arr2)//[1,[1,4],5,[{name:'bobo'}]]

總結了這麼多方法實現深拷貝，下面總結一個完整的深拷貝的實現方法

DeepCopy (obj) {
let str;
let newobj;
if (typeof obj !== 'object') {
return obj;
} else if (window.JSON) {
str = JSON.stringify(obj);
newobj = JSON.parse(str);
} else {
newobj = obj.constructor === Array ? [] : {};
for (var i in obj) {
newobj[i] = typeof obj[i] === 'object' ? this.DeepCopy(obj[i]) : obj[i];
}
}
return newobj;
},