深拷贝和浅拷贝JavaScript

深拷贝和浅拷贝

     假设B复制了A，当修改A时，看B是否会发生变化。如果B变化了，那么就是浅拷贝；如果B没有变化，则是深拷贝。

js数据类型

     JavaScript的数据类型分为两种：原始类型（即基本数据类型）和对象类型（即引用数据类型）。

• js常用的基本数据类型包括undefined、null、number、boolean、string；
• js的引用数据类型也就是对象类型Object，比如：Object、array、function、data等；

基本数据类型

     基本数据类型是按值访问的，存放在栈中。就是说我们可以操作保存在变量中的实际的值；基本数据类型的值是不可变的，任何方法都无法改变一个基本数据类型的值，所以基本数据类型不存在深浅拷贝。
栈内存（stack）：会自动分配的内存空间，它由系统自动释放。

引用数据类型

     引用数据类型也叫对象数据类型，包括function , object ,array, date等可以可以使用new创建的数据，又叫对象类型，它在栈内存中仅仅存储了一个引用，而真正的数据存储在堆内存中。
堆内存（heap）：动态分配的内存及大小，不一定会自动释放。
特点：

• 引用类型的值可以改变，可以添加属性和方法。
• 引用数据类型的赋值是对象引用，引用类型的比较是引用的比较
• 引用类型是同时保存在栈区中和堆区中的，引用类型的存储需要在内存的栈区和堆区中共同完成，栈区保存变量标识符和指向堆内存的地址。

实现浅拷贝

 function clone(obj) {
        var cloneObj = {};
        for(var key of Object.keys(obj)) {
            cloneObj[key] = obj[key];
        }
        return cloneObj;
    }

实现原理：创建一个拷贝的方法 clone()，通过遍历传入对象的键名及键值，然后赋值给一个空对象，这样就完成了对原对象的浅拷贝。浅拷贝只复制了原对象中最外层的属性，也就是拷贝了其基本类型的数据，而对于引用类型数据而言，它仅复制了其引用，指向的地址还是原对象的地址。

实现深拷贝

递归实现

  function copy(obj){
        let newobj = null;   //声明一个变量用来储存拷贝之后的内容
        
     //判断数据类型是否是复杂类型，如果是则调用自己，再次循环，如果不是，直接赋值即可，
     //由于null不可以循环但类型又是object，所以这个需要对null进行判断
        if(typeof(obj) == 'object' && obj !== null){ 
        
	//声明一个变量用以储存拷贝出来的值,根据参数的具体数据类型声明不同的类型来储存
            newobj = obj instanceof Array? [] : {};   
            
	//循环obj 中的每一项，如果里面还有复杂数据类型，则直接利用递归再次调用copy函数
            for(var i in obj){  
                newobj[i] = copy(obj[i])
            }
        }else{
            newobj = obj
        }    
      return newobj;    //函数必须有返回值，否则结构为undefined
   }

内置对象JSON

 function JSONClone(obj) {
            return JSON.parse(JSON.stringify(obj))
        }

隐患

1. 拷贝的对象的值中如果有函数、undefined、symbol 这几种类型，经过 JSON.stringify 序列化之后的字符串中这个键值对会消失；
2. 拷贝 Date 引用类型会变成字符串；
3. 无法拷贝不可枚举的属性；
4. 无法拷贝对象的原型链；
5. 拷贝 RegExp 引用类型会变成空对象；
6. 对象中含有 NaN、Infinity 以及 -Infinity，JSON 序列化的结果会变成 null；

循环引用

     那如果需要实现深拷贝的对象存在循环引用的情况呢？
如：

obj={
     a:1,
     b:2,
     c:obj
}

     自然用上面遍历的方法来进行深拷贝，遍历的遇到值是自己 又是一个对象 继续遍历 然后发现这个值又是自己 ，又继续遍历，从而造成一个死循环=>爆栈。

function deepClones(origin, map = new WeakMap()) {
  // origin == undefined可以同时判断undefined和null
  if (origin == undefined || typeof origin !== "object") {
    return origin;
  } else if (origin instanceof Date) {
    return new Date(origin);
  } else if (origin instanceof RegExp) {
    return new RegExp(origin);
  } else {
    const key = map.get(origin);
    if (key) {//检查循环引用，直接返回
      return key;
    }
    const target = new origin.constructor();
    map.set(origin, target);
    for (let k in origin) {
      target[k] = deepClones(origin[k], map);
    }
    return target;
  }
}

     在这个方法中，利用了weakmap弱映射的键只能是Object的特点，通过WeakMap来存储每次递归的键值对，如果当前递归的属性已存在就直接返回。