浅拷贝:
浅拷贝出现原因
let a = {
name:'Jack',
age:'10'
};
let b = a;
a.name = 'Wang';
console.log(a.name);//Wang
console.log(b.name);//Wang
上述代码中,如果我们希望a和b的属性是独立的,那么最后结果显然不符期望,
简单来说发生原因:引用类型,栈内存存放指针,内容在堆内存中,赋值时只拷贝了指针。
**浅拷贝常用方法
1.Object.assign()
let shallowA = {
name:'Jack',
age:10
};
let shallowB = Object.assign({},shallowA);
shallowA.name = 'Zhang';
console.log(shallowA.name);//Zhang
console.log(shallowB.name);//Jack
2.三点运算符
let shallowC = {...shallowA};
shallowA.age = 11;
console.log(shallowA.age);//11
console.log(shallowC.age);//10
深拷贝
深拷贝出现原因
let c = {
name:'June',
family:{
mother:'Lily',
father:'Bob'
},
age:12
}
let d = {...c};
let e = Object.assign({},c);
c.family.mother = 'Venessa';
console.log(c.family);//mother:'Venessa'
console.log(d.family);//mother:'Venessa'
console.log(e.family);//mother:'Venessa'
简单来说,对于这种对象中仍有对象的情况,就需要使用深拷贝了
深拷贝常用方法
1.JSON.parse(JSON.stringfy(object))
let deepA = {
age: 1,
jobs: {
first: 'FE'
}
};
let deepB = JSON.parse(JSON.stringify(deepA));
deepA.jobs.first = 'Ali';
console.log(deepA.jobs);//Ali
console.log(deepB.jobs);//FE
这种方法是利用JSON序列化和反序列化方法将内容完全展开,但是它仍有局限性:
1.会忽略 undefined
2.会忽略 symbol
3.会忽略 函数
4.不能解决循环引用的对象(obj.a = obj.b obj.c.d = obj.a等)
使用lodash的deepClone()
lodash库中的deepClone函数。