别再看碎片化知识了,深拷贝浅拷贝真的很简单

90 阅读1分钟

深拷贝

拷贝的对象是独立的

白话:你改变一个另一个不会改变

浅拷贝

拷贝的对象是与被拷贝对象引用同一个地址

白话:你改变一个另一个也会被改变

注意:

  • 基本类型赋值就是深拷贝;
  • 比如:结构赋值所解构的原对象是一维数组或对象,其本质就是对基本数据类型进行等号赋值,那它就是深拷贝;
  • 如果是多维数组或多层对象,那除了第一层其它就是浅拷贝

例子:

拷贝常用方式: 展开运算符Object.assign()Object.keys()

//展开运算符
var obj1={a:1,b:2,c:{d:3}}
var obj2={...obj1}
obj2.a=5
obj2.c.d=5
console.log(obj1)//{a: 1, b: 2, c: {d:5}}
console.log(obj2)//{a: 5, b: 2, c: {d:5}}
//Object.assign()
var obj1={a:1,b:2,c:{d:3}}
var obj2=Object.assign({e:4},obj1)
obj2.a=5
obj2.c.d=5
console.log(obj1)//{a: 1, b: 2, c: {d:5}}
console.log(obj2)//{e: 4,a: 5, b: 2, c: {d:5}}
//Object.keys()
var obj1={a:1,b:2,c:{d:3}}
Object.keys(obj1).forEach(item=>{
    obj2[item]=obj1[item]
})
obj2.a=5
obj2.c.d=5
console.log(obj1)//{a: 1, b: 2, c: {d:5}}
console.log(obj2)//{a: 5, b: 2, c: {d:5}}

总结:以上方法都是让第一层变成基本类型从而让第一层达到深拷贝的效果,里层变成浅拷贝,如果想实现深拷贝就需要用到第三方库Lodash或递归实现。

当然还有一种比较简便但是有缺陷的方式。

深拷贝

//JSON.parse(JSON.stringify())——此方式虽然可以实现深拷贝,但是如果对象里存在undefined和null会丢失
var obj1={a:1,b:2,c:{d:3}}
JSON.parse(JSON.stringify(obj1))
obj2.a=5
obj2.c.d=5
console.log(obj1)//{a: 1, b: 2, c: {d:3}}
console.log(obj2)//{a: 5, b: 2, c: {d:5}}