1.浅拷贝
赋值运算符 “ = ” 实现的是浅拷贝,只拷贝对象的引用,而未复制真正的值。
(两个值之间会相互影响)
2.深拷贝
深拷贝就是对目标的完全拷贝,不像浅拷贝那样只是复制了一层引用,就连值也都复制了。
(只要进行了深拷贝,它们谁也不会影响谁)
2.1递归:利用递归来实现每一层都重新创建对象并赋值
deepClone(source: any){
const targetObj = source.constructor === Array ? [] : {}; // 创建对象:并判断复制的目标是数组还是对象
for(let keys in source){ // 遍历目标
if(source[keys] && typeof source[keys] === 'object'){ // 如果值是对象,就递归一下
//@ts-ignore
targetObj[keys] = source[keys].constructor === Array ? [] : {};
//@ts-ignore
targetObj[keys] = this.deepClone(source[keys]);
}else{ // 如果不是,就直接赋值
//@ts-ignore
targetObj[keys] = source[keys];
}
}
return targetObj;
}
2.2JSON.stringify/parse的方法
let arr = [1,2,3,4,5];
let arr2 = JSON.parse(JSON.stringify(arr));
3.首层浅拷贝
对目标对象的第一层进行深拷贝,然后后面的是浅拷贝,可以称作“首层浅拷贝”。
3.1使用for in
对象
let obj = {
name: 'zs',
age: '18'
};
let obj2 = {};
for(let keys in obj) {
obj2[keys] = obj[keys];
}
obj2.name = 'ls'; //修改obj2的值,但是不影响obj
console.log(obj); // obj = { name: 'zs',age: '18'};
console.log(obj2); // obj2 = { name: 'ls',age: '18'};
数组
let arr = [15,11,54];
let arr2 = [];
for(let keys in arr) {
arr2[keys] = arr[keys];
}
arr2[2] = 99; //修改arr2的值,但是不影响arr
console.log(arr); //[15,11,54]
console.log(arr2); //[15,11,99]
3.2我们可以通过 assign 、扩展运算符等方式来实现浅拷贝:
let obj = {name:'zs'};
let obj2 = Object.assign({}, obj);
let obj3 = {...obj}