1.我們?cè)趺慈?shí)現(xiàn)深拷貝呢，這里可以遞歸遞歸去復(fù)制所有層級(jí)屬性。

這么我們封裝一個(gè)深拷貝的函數(shù)(PS：只是一個(gè)基本實(shí)現(xiàn)的展示，并非最佳實(shí)踐)
復(fù)制代碼

function deepClone(obj){let objClone = Array.isArray(obj)?[]:{};if(obj && typeof obj==="object"){for(key in obj){if(obj.hasOwnProperty(key)){//判斷ojb子元素是否為對(duì)象，如果是，遞歸復(fù)制if(obj[key]&&typeof obj[key] ==="object"){objClone[key] = deepClone(obj[key]);}else{//如果不是，簡(jiǎn)單復(fù)制objClone[key] = obj[key];}}}}return objClone; } let a=[1,2,3,4],b=deepClone(a); a[0]=2; console.log(a,b);

復(fù)制代碼

可以看到

跟之前想象的一樣，現(xiàn)在b脫離了a的控制，不再受a影響了。

這里再次強(qiáng)調(diào)，深拷貝，是拷貝對(duì)象各個(gè)層級(jí)的屬性，可以看個(gè)例子。JQ里有一個(gè)extend方法也可以拷貝對(duì)象，我們來看看

let a=[1,2,3,4],b=a.slice(); a[0]=2; console.log(a,b);

那是不是說slice方法也是深拷貝了，畢竟b也沒受a的影響，上面說了，深拷貝是會(huì)拷貝所有層級(jí)的屬性，還是這個(gè)例子，我們把a(bǔ)改改

let a=[0,1,[2,3],4],b=a.slice(); a[0]=1; a[2][0]=1; console.log(a,b);

拷貝的不徹底啊，b對(duì)象的一級(jí)屬性確實(shí)不受影響了，但是二級(jí)屬性還是沒能拷貝成功，仍然脫離不了a的控制，說明slice根本不是真正的深拷貝。

這里引用知乎問答里面的一張圖

第一層的屬性確實(shí)深拷貝，擁有了獨(dú)立的內(nèi)存，但更深的屬性卻仍然公用了地址，所以才會(huì)造成上面的問題。

同理，concat方法與slice也存在這樣的情況，他們都不是真正的深拷貝，這里需要注意。

2.除了遞歸，我們還可以借用JSON對(duì)象的parse和stringify
復(fù)制代碼

function deepClone(obj){let _obj = JSON.stringify(obj),objClone = JSON.parse(_obj);return objClone } let a=[0,1,[2,3],4],b=deepClone(a); a[0]=1; a[2][0]=1; console.log(a,b);

復(fù)制代碼

可以看到，這下b是完全不受a的影響了。

附帶說下，JSON.stringify與JSON.parse除了實(shí)現(xiàn)深拷貝，還能結(jié)合localStorage實(shí)現(xiàn)對(duì)象數(shù)組存儲(chǔ)。有興趣可以閱讀博主這篇文章。

localStorage存儲(chǔ)數(shù)組，對(duì)象，localStorage,sessionStorage存儲(chǔ)數(shù)組對(duì)象

3.除了上面兩種方法之外，我們還可以借用JQ的extend方法。

$.extend( [deep ], target, object1 [, objectN ] )

deep表示是否深拷貝，為true為深拷貝，為false，則為淺拷貝

target Object類型 目標(biāo)對(duì)象，其他對(duì)象的成員屬性將被附加到該對(duì)象上。

object1 objectN可選。 Object類型 第一個(gè)以及第N個(gè)被合并的對(duì)象。

let a=[0,1,[2,3],4],
b=$.extend(true,[],a); a[0]=1; a[2][0]=1; console.log(a,b);

可以看到，效果與上面方法一樣，只是需要依賴JQ庫(kù)。

說了這么多，了解深拷貝也不僅僅是為了應(yīng)付面試題，在實(shí)際開發(fā)中也是非常有用的。例如后臺(tái)返回了一堆數(shù)據(jù)，你需要對(duì)這堆數(shù)據(jù)做操作，但多人開發(fā)情況下，你是沒辦法明確這堆數(shù)據(jù)是否有其它功能也需要使用，直接修改可能會(huì)造成隱性問題，深拷貝能幫你更安全安心的去操作數(shù)據(jù)，根據(jù)實(shí)際情況來使用深拷貝，大概就是這個(gè)意思。

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的实现深拷贝的几种方法的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。