js物件的深拷貝和淺拷貝

2021-10-01 23:33:23 字數 1901 閱讀 8006

淺拷貝:只是複製指向某個物件的指標,而不複製物件本身新舊物件,它們還是共享同一記憶體。

深拷貝:會另選創造乙個一模一樣的物件,新物件和原物件不共享記憶體,修改新物件不會改到原物件。也就是老死不相往來了

知道了深淺拷貝的含義,那就來總結如何實現深淺拷貝。

let data=,]

}//第一種情況:

let obj=data;

//淺拷貝

obj.name=

'aa'

//修改name的值 data的name值也發生改變

console.

log(obj,data)

;//第二種情況:

let obj1=

;//定義obj1是乙個物件,並且將data是obj1的子物件。

obj1.name=

'bb'

//給obj1新增name屬性,data的name值不發生改變

obj1.data.impl[0]

.e=4

; obj1.data.name=

'pp'

; console.

log(obj1,data)

;//第三種情況:

let obj2=

;//物件obj2拷貝data的值,如果屬性第一層不是物件則是深拷貝。

obj2.name=

'cc';

obj2.impl[0]

.e=3

console.

log(obj2,data)

;

以上的**是我無聊的時候瞎寫的**,但是我發現列印出來的值都是不一樣的。有些知識點還是值得去總結的。

淺拷貝:

如上第一種情況就是乙個淺拷貝的過程,obj和data共用乙個記憶體位址,所以誰變誰都會變,這樣很危險哦。

第二種情況雖然data是obj1的子物件,但是子物件和父物件也是淺拷貝的關係。

第三種情況也是淺複製,只能解決物件一層屬性的所有複製。即屬性不是物件,則修改它變成乙個新的值則原物件不會發生改變。

對於第三種這個情況:有時候是深拷貝,有時候是淺拷貝 這樣的語法在js很常見。只有當屬性值不是物件的時候則是深拷貝否則就是淺拷貝

1、for in 遍歷迴圈拷貝;

2、es6 object.assign(,obj);

3、;4、concat;

5、slice

那麼如何才能實現真正的拷貝呢?也就是真的老死不相往來了,一點關係也沒有了呢?

1、利用json物件的parse和stringfy

json.stringfy是將乙個js物件值轉成乙個json字串;json.parse是將乙個json字串轉成乙個js物件。先轉成字串再轉物件,所生成的物件和原來的物件不共用同一記憶體,實現深拷貝的過程。但是有個問題:undefined、function、symbol在轉化中會被忽略。

2、利用遞迴函式來實現

function deepclone

(source)

;for

(let keys in source)

; targetobj[keys]

=deepclone

(source[keys])}

else}}

return targetobj;

}

3、loadsh第三方庫來實現 _.clonedeep

var obj=

} var obj1=_.

clonedeep

(obj)

; obj1.a.c=6;

console.

log(obj1,obj)

;

js物件淺拷貝和深拷貝

1 淺拷貝 varobj 定義乙個物件 functioncopy obj 定義乙個空物件,用來儲存key和value for varkeyinobj returnnewobj 將新物件作為返回值,返回到外面 varobj2 copy obj 將obj複製給obj2 obj2.a 20 改變obj2中...

js 物件深拷貝 深拷貝與淺拷貝

前言 最近在複習一些面試的知識點,剛剛好複習到了這一部分,於是就寫下這篇文章記錄一下。一 值型別和引用型別 在學習深拷貝和淺拷貝之前,我們先來了解一下js的變數型別。值型別 vs 引用型別 值型別 值型別主要有 number,string,boolean,symbol,null,undefined ...

js物件之淺拷貝和深拷貝

淺拷貝依次遍歷內容,依次賦值 var p var k console.log p console.log k for let key in p console.log p console.log k 使用object.assign 方法,這個方法的作用 問題來,你這樣依次拷貝出現的問題就是物件裡面含...