浅拷贝和深拷贝

目录

复杂数据类型

浅拷贝

简单数据类型

深拷贝三种实现方式

 解决方案JSON.parse（JSON.stringfy()）

               JSON.parse（JSON.stringfy()）的问题

 Object.assign()

 递归方式实现深拷贝

---

简单数据类型有：Number String undefined null Boolean Symbol

复杂数据类型（引用类型）：function Array Object Date Math RegExp

栈（小） 堆（大）

两者结果不同是因为简单数值类型和复杂数据类型存储方式的不同

复杂数据类型

浅拷贝：只复制指向某个对象的指针，而不复制对象本身，新旧对象还是共享同一块内存

深拷贝：会另外创造一个一模一样的对象，新对象跟原对象不共享内存，修改新对象不会改到原对象。

浅拷贝

obj1改变，obj2也改变了

//浅拷贝 对象
let obj1 ={
  a:1
}
let obj2=obj1
obj1.a=2
console.log(obj2)//{a:2}

 1.堆中存内容 栈中存名字

2.obj2指向的也是obj1在堆中的地址，和obj1指向的是一个堆

简单数据类型

//简单数值型
let a=1;
let b=a;
a=2;
console.log(b)//1

1.赋值的过程其实是在栈中开辟空间 

 2.a改变时,b没有改变

深拷贝三种实现方式

 解决方案JSON.parse（JSON.stringfy()）

obj3改变，obj4不再改变了

let obj3 ={
  a:1
}
let obj4 = JSON.parse(JSON.stringify(obj3))
obj3.a=2
console.log(obj4)//{a:1}

 JSON.parse（JSON.stringfy()）的问题

缺点：

     1.函数无法拷贝  2.正则无法拷贝 3.undefined无法拷贝 

优点：二级以下也可以实现深拷贝

 Object.assign()

obj2的值也没有改变，实现了深拷贝

let obj1={
  a:1
}
let obj2={}
Object.assign(obj2,obj1)
obj1.a=2
console.log(obj2)

优点：1可以拷贝函数  2.可以拷贝正则 3.可以拷贝undefined

 缺点：深层对象只能实行浅拷贝，二级以下只能实行浅拷贝

 递归方式实现深拷贝

p1变得时候p2没有改变

function deepCopy(dest,src){
  var dest = dest || {};
  for(var key in src){
    //如果对象的属性又是对象，则递归处理
    if(typeof src[key] === "object"){ 
        dest[key]= (src[key].constructor === Array)?[]:{}; 
        deepCopy(dest[key],src[key]); 
    }else{
        dest[key]=src[key];  
    }
  }
  return dest;
}
var p1 = {
  name: 'jack',
  age:12,
  toy: {
      name:'car'
  }
}

var p2 = deepCopy({},p1);
p1.toy.name="rr"
console.log(p2)