关于深拷贝

关于深拷贝

浅拷贝是将原始对象中的数据型字段拷贝到新对象中去，将引用型字段的“引用”复制到新对象中去，不把“引用的对象”复制进去，所以原始对象和新对象引用同一对象，新对象中的引用型字段发生变化会导致原始对象中的对应字段也发生变化。

深拷贝是在引用方面不同，深拷贝就是创建一个新的和原始字段的内容相同的字段，是两个一样大的数据段，所以两者的引用是不同的，之后的新对象中的引用型字段发生改变，不会引起原始对象中的字段发生改变。

1 对象的深拷贝

var copyObj = {

name: 'ziwei',

arr : [1,2,3]

}

var targetObj = JSON.parse(JSON.stringify(copyObj))

此时 copyObj.arr !== targetObj.arr 已经实现了深拷贝 

缺点是

如果你的对象里有函数,函数无法被拷贝下来

无法拷贝copyObj对象原型链上的属性和方法

·只有对象里嵌套对象的情况下,才会根据需求讨论,我们要深拷贝还是浅拷贝。

无论哪种拷贝，内存空间都不同

var obj2 = shallowCopy( obj1 , {})

浅拷贝对象里的arr引用指向的都是相同的内存空间

var obj2 = deepCopy( obj1 , {})

深拷贝他们2个对象里arr的引用,指向【不同的】内存空间

for 循环实现数组的深拷贝

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抽离全部数组实现深拷贝

var arr = [1,2,3,4,5]

var arr2 = arr.slice(0)

arr[2] = 5

console.log(arr)

console.log(arr2)

concat 方法连接自己返回新数组实现数组的深拷贝

var arr = [1,2,3,4,5]

var arr2 = arr.concat()

arr[2] = 5

console.log(arr)

console.log(arr2)

ES6扩展运算符

var arr = [1,2,3,4,5]

var [ ...arr2 ] = arr

arr[2] = 5

console.log(arr)

console.log(arr2)

对象for循环的深拷贝

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

}

对象ES6扩展的深拷贝

var obj = {

name: 'FungLeo',

sex: 'man',

old: '18'

}

var { ...obj2 } = obj

obj.old = '22'

console.log(obj)

console.log(obj2)