JS深浅拷贝常用方法

浅拷贝：

浅拷贝出现原因

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函数。

JS深浅拷贝常用方法

浅拷贝：

深拷贝

推荐阅读更多精彩内容