關(guān)于深拷貝
淺拷貝是將原始對(duì)象中的數(shù)據(jù)型字段拷貝到新對(duì)象中去了罪,將引用型字段的“引用”復(fù)制到新對(duì)象中去锭环,不把“引用的對(duì)象”復(fù)制進(jìn)去,所以原始對(duì)象和新對(duì)象引用同一對(duì)象泊藕,新對(duì)象中的引用型字段發(fā)生變化會(huì)導(dǎo)致原始對(duì)象中的對(duì)應(yīng)字段也發(fā)生變化辅辩。
深拷貝是在引用方面不同,深拷貝就是創(chuàng)建一個(gè)新的和原始字段的內(nèi)容相同的字段娃圆,是兩個(gè)一樣大的數(shù)據(jù)段玫锋,所以兩者的引用是不同的,之后的新對(duì)象中的引用型字段發(fā)生改變踊餐,不會(huì)引起原始對(duì)象中的字段發(fā)生改變景醇。
1 對(duì)象的深拷貝
var copyObj = {
name: 'ziwei',
arr : [1,2,3]
}
var targetObj = JSON.parse(JSON.stringify(copyObj))
此時(shí) copyObj.arr !== targetObj.arr 已經(jīng)實(shí)現(xiàn)了深拷貝?
缺點(diǎn)是
如果你的對(duì)象里有函數(shù),函數(shù)無法被拷貝下來
無法拷貝copyObj對(duì)象原型鏈上的屬性和方法
·只有對(duì)象里嵌套對(duì)象的情況下,才會(huì)根據(jù)需求討論,我們要深拷貝還是淺拷貝臀稚。
無論哪種拷貝吝岭,內(nèi)存空間都不同
var obj2 = shallowCopy( obj1 , {})
淺拷貝對(duì)象里的arr引用指向的都是相同的內(nèi)存空間
var obj2 = deepCopy( obj1 , {})
深拷貝他們2個(gè)對(duì)象里arr的引用,指向【不同的】內(nèi)存空間
for 循環(huán)實(shí)現(xiàn)數(shù)組的深拷貝
var arr = [1,2,3,4,5]
var arr2 = copyArr(arr)
function copyArr(arr) {
let res = []
for (let i = 0; i < arr.length; i++) {
res.push(arr[i])
}
return res
}
slice抽離全部數(shù)組實(shí)現(xiàn)深拷貝
var arr = [1,2,3,4,5]
var arr2 = arr.slice(0)
arr[2] = 5
console.log(arr)
console.log(arr2)
concat 方法連接自己返回新數(shù)組實(shí)現(xiàn)數(shù)組的深拷貝
var arr = [1,2,3,4,5]
var arr2 = arr.concat()
arr[2] = 5
console.log(arr)
console.log(arr2)
ES6擴(kuò)展運(yùn)算符
var arr = [1,2,3,4,5]
var [ ...arr2 ] = arr
arr[2] = 5
console.log(arr)
console.log(arr2)
對(duì)象for循環(huán)的深拷貝
var obj = {
name: 'FungLeo',
sex: 'man',
old: '18'
}
var obj2 = copyObj(obj)
function copyObj(obj) {
let res = {}
for (var key in obj) {
res[key] = obj[key]
}
return res
}
對(duì)象ES6擴(kuò)展的深拷貝
var obj = {
name: 'FungLeo',
sex: 'man',
old: '18'
}
var { ...obj2 } = obj
obj.old = '22'
console.log(obj)
console.log(obj2)