問題描述

有時候對數組之類的操作的時候，會使用clone方法，感覺不使用這個直接賦值也可以啊，這樣做有什么好處？為了省內存？還有什么淺拷貝深拷貝之類的，原諒我是小白。。

問題解答

好處就是，不同于“=”，clone的數組是在內存中是獨立的，你可以對它為所欲為。

js中，數組和對象都屬于引用類型。

const arr = [1, 2, 3, 4, 5, 6];const arr1 = arr; // 直接賦值，arr1指向的是arr的內存，也就是說arr發生改變時，arr1也會被改變arr.push(123);console.log(arr1); // [1, 2, 3, 4, 5, 6, 123]

const arr = [1, 2, 3, 4, 5, 6];const arr1 = arr.slice(0); // 克隆了一個arr1，arr與arr1指向不同的內存，arr的改變并不會影響到arr1arr.push(123);console.log(arr1); // [1, 2, 3, 4, 5, 6]

所以，克隆的作用就是用來新生成一份數據，不污染原來的數據。

至于深拷貝與淺拷貝：

const obj1 = { name: ’Ash’, class: {a: 1,b: 2, }};// 淺拷貝const obj2 = {};for (let key in obj1) { obj2[key] = obj1[key];}// 深拷貝const copyObj = (obj) => { const newObj = {}; for (let key in obj) {if (typeof obj[key] !== ’object’) { newObj[key] = obj[key];} else { newObj[key] = copyObj(obj[key]);} } return newObj;}const obj3 = copyObj(obj1);obj1.name = ’Coco’;obj1.class.a = 100;console.log(obj2.name, obj2.class.a); // Ash 100console.log(obj3.name, obj3.class.a); // Ash 1

可以看到，淺拷貝與深拷貝的區別在于：淺拷貝只是遍歷了obj1的第一層，然后把obj1的每個屬性都賦值給了obj2；而深拷貝則不會，當屬性值為對象時，深拷貝會new一個空對象，然后把對象的值賦值給這個空對象，在返回這個空對象作為obj3的屬性。

JS 編程中很重要的一個原則是「不是你的對象不要動」

做個形象的比喻，我借給你一本書（object），我以為你只是要閱讀（read），你卻拿去練字（write），這本書還給我我都沒辦法在讀到正常的內容了。

而 deepClone 就解決了這個問題，我給你一本書，你去復印一下，書原樣還給我，復印本你就可以隨意處置了。

javascript中的深拷貝和淺拷貝？