JS的深拷貝與淺拷貝

2021-09-29 05:24:38 字數 1005 閱讀 3469

深拷貝和淺拷貝主要是針對物件賦值的。

物件a賦值給物件b,實際上只是b接受了a物件的指標。當引用物件b時,先引用a的位址,再引用a的屬性和方法。

這樣,如果對a的屬性值進行修改的時候,再引用b時,b的屬性值也會發生變化。

為了避免這種混亂的局面,js提出淺拷貝和深拷貝的概念。

淺拷貝  object.assgin() 或

淺拷貝物件時,會直接把原物件內的屬性值都賦值到新物件中。例如:

let a = 

let b = object.assign({}, a)

a.age = 2

console.log(b.age) // 1

但是這種方法也有弊端,即不能深拷貝是物件的屬性值,拷貝的是位址。

淺拷貝也可以通過展開運算子來實現。

let a = 

let b =

a.age = 2

console.log(b.age) // 1

深拷貝 ——如果物件屬性值是物件的話,就要用到深拷貝了。

例如:

let a = 

}let b =

a.jobs.first = 'native'

console.log(b.jobs.first) // native

這裡雖然對物件a用了淺拷貝,但是物件的屬性jobs也是物件,拷貝的時候這個屬性並沒有按屬性值賦給物件b。這種情況需要用到深拷貝。

json.parse(json.stringify(object))

let a = 

}let b = json.parse(json.stringify(a))

a.jobs.first = 'native'

console.log(b.jobs.first) // fe

但是這種方法也有缺點,對於undefined的屬性,symbol,序列化函式,迴圈引用等 不能深拷貝。具體請聽下回分解。

js深拷貝與淺拷貝

1 基礎知識 基本型別與引用型別 js中可以把變數分成兩部分,基本型別和引用型別。基本型別包括 undefined null boolean number和string 引用型別值可能由多個值構成的物件。在對基礎型別資料進行拷貝時,實際相當於建立新的相同資料 hello 賦值給b var a hel...

js 淺拷貝與深拷貝

js 有兩種資料型別,基礎資料型別和引用資料型別 基礎資料型別都是按值訪問的,我們可以直接操作儲存在變數中的實際的值。而引用型別如array,1.淺拷貝 只複製指向某個物件的指標,而不複製物件本身,新舊物件共享一塊記憶體 淺拷貝是指只複製一層物件,當物件的屬性是引用型別時,實質複製的是其引用,當引用...

js深拷貝與淺拷貝

實現乙個頁面或者乙個功能時,常常遇到的場景需要我們備份乙個陣列或者物件,這時候出現了深拷貝與淺拷貝效果截然不同呀總結如下 var arr 1,2,3,4 shallowarr arr arr 0 change console.log arr console.log shallowarr change...