談一談js中的深拷貝與淺拷貝

2021-09-11 21:50:18 字數 1712 閱讀 1367

let a = 

let b = a

a.age = 2

console.log(b.age) // 2

從上述例子中我們可以發現,如果給乙個變數賦值乙個物件,那麼兩者的值會是同乙個引用,其中一方改變,另一方也會相應改變。通常在開發中我們不希望出現這樣的問題,我們可以使用淺拷貝來解決這個問題。

****

首先可以通過 object.assign 來解決這個問題。

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

淺拷貝只解決了第一層的問題,如果接下去的值中還有物件的話,那麼就又回到剛開始的話題了,兩者享有相同的引用。要解決這個問題,我們需要引入深拷貝。

****

這個問題通常可以通過 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

• 不能序列化函式

• 不能解決迴圈引用的物件

let obj = ,

}obj.c = obj.b

obj.e = obj.a

obj.b.c = obj.c

obj.b.d = obj.b

obj.b.e = obj.b.c

let newobj = json.parse(json.stringify(obj))

console.log(newobj)

let a = ,

name: 'yck'

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

console.log(b) //

你會發現在上述情況中,該方法會忽略掉函式和 undefined 。但是在通常情況下,複雜資料都是可以序列化的,所以這個函式可以解決大部分問題,並且該函式是內建函式中處理深拷貝效能最快的。當然如果你的資料中含有以上三種情況下,可以使用下面函式進行深拷貝

//遞迴深複製

function cloneobject(target,source)else;

}object.defineproperty(target,names[i],)

cloneobject(obj,desc.value);

}else

}}

js中的深拷貝與淺拷貝

今天面試被問到js中深淺拷貝的問題,當時回答的並不好,回來搜尋了一波,現做下總結 js中針對引用型別的拷貝分為兩種 深拷貝和淺拷貝 淺拷貝比較簡單,分為兩類,一類是直接對源物件進行拷貝,實際上就是引用型別的賦值,拷貝的僅僅是物件引用,如 var obj var newobj obj newobj.a...

JS中的深拷貝與淺拷貝

說到深淺拷貝的時候就不得不說一下js中的變數型別了 淺拷貝分兩種情況,拷貝源物件的引用和源物件拷貝例項,但其屬性拷貝引用.拷貝源的引用 eg let obj1 let obj2 obj1 console.log obj1 obj2 true obj1.a 2 console.log obj2.a 2...

JS中的深拷貝與淺拷貝

深拷貝和淺拷貝最根本的區別在於是否是真正獲取了乙個物件的複製實體,而不是引用,深拷貝的實現 1.通過遞迴解決 var a function deepcopy initobj,finalobj for var i in initobj if typeof initobj i object argume...