因为Array和Object是引用类型。所以直接用=号赋值的话,只是把源数组或对象的地址(或叫指针)赋值给目的数组或对象,并没有实现数据的深拷贝。
slice 方法实现数组的深拷贝
该方法可以将原数组中抽离部分出来形成一个新数组,只要设置为抽离全部,即可完成数组的深拷贝。代码如下:
const arr = [1,2,3,4,5]
const arr2 = arr.slice(0)
arr[2] = 10
console.log(arr)
console.log(arr2)
运行结果:
concat 方法实现数组的深拷贝
该方法用于连接多个数组组成一个新的数组的方法。那么只要连接它自己,即可完成数组的深拷贝。代码如下:
const arr = [1,2,3,4,5]
const arr2 = arr.concat()
arr[2] = 10
console.log(arr)
console.log(arr2)
运行结果:
Object.assign() 拷贝
当对象中只有一级属性,没有二级属性的时候,此方法为深拷贝,但是对象中有对象的时候(有二级属性),此方法就是浅拷贝。
JSON.stringify 和 JSON.parse
用 JSON.stringify 把对象转换成字符串,再用 JSON.parse 把字符串转换成新的对象。
可以转成 JSON 格式的对象才能使用这种方法,如果对象中包含 function 或 RegExp 这些就不能用这种方法了。
const obj = {
name:{ names:'张三' },
age: 24
}
const obj2 = JSON.parse(JSON.stringify(obj))
obj2.name.names = '王二'
obj2.age = 48
console.log(obj)
console.log(obj2)
运行结果:
使用递归的方式实现深拷贝
function _deepClone(source) {
let target;
if (typeof source === 'object') {
target = Array.isArray(source) ? [] : {}
for (let key in source) {
if (source.hasOwnProperty(key)) {
if (typeof source[key] !== 'object') {
target[key] = source[key]
} else {
target[key] = _deepClone(source[key])
}
}
}
} else {
target = source
}
return target
}