深拷贝浅拷贝

https://www.cnblogs.com/minigrasshopper/p/8746757.html   

这篇文章是转载于上面的链接地址，觉得写的非常好，所以收藏了，感谢原创作者的分享。

浅拷贝和深拷贝都是对于JS中的引用类型而言的，浅拷贝就只是复制对象的引用（堆和栈的关系，简单类型Undefined，Null，Boolean，Number和String是存入堆，直接引用，object array 则是存入桟中，只用一个指针来引用值），如果拷贝后的对象发生变化，原对象也会发生变化。只有深拷贝才是真正地对对象的拷贝。

浅拷贝：浅拷贝的意思就是只复制引用（指针），而未复制真正的值。

深拷贝

深拷贝就是对目标的完全拷贝，不像浅拷贝那样只是复制了一层引用，就连值也都复制了。

只要进行了深拷贝，它们老死不相往来，谁也不会影响谁。

目前实现深拷贝的方法不多，主要是两种：

        利用JSON对象中的parse和stringify

        利用递归来实现每一层都重新创建对象并赋值

最完备的深拷贝：递归方法-->  就是对每一层的数据都实现一次 创建对象->对象赋值 的操作

function deepClone(source){

  const targetObj = source.constructor === Array ? [] : {}; // 判断复制的目标是数组还是对象

  for(let keys in source){    // 遍历目标   for...in循环对象的所有枚举属性

    if(source.hasOwnProperty(keys)){    //Object的hasOwnProperty()方法返回一个布尔值，判断对象是否包含特定的自身（非继承）属性。

      if(source[keys] && typeof source[keys] === 'object'){ // 如果值是对象，就递归一下

        targetObj[keys] = source[keys].constructor === Array ? [] : {};

        targetObj[keys] = deepClone(source[keys]);

      }else{ // 如果不是，就直接赋值

        targetObj[keys] = source[keys];

      }

    }

  }

  return targetObj;

}

测试下：

const originObj = {a:'a',b:'b',c:[1,2,3],d:{dd:'dd'}};

const cloneObj = deepClone(originObj);

console.log(cloneObj === originObj); // false

cloneObj.a = 'aa';

cloneObj.c = [1,1,1];

cloneObj.d.dd = 'doubled';

console.log(cloneObj); // {a:'aa',b:'b',c:[1,1,1],d:{dd:'doubled'}};

console.log(originObj); // {a:'a',b:'b',c:[1,2,3],d:{dd:'dd'}};

可以。那再试试带有函数的：

const originObj = {

  name:'axuebin',

  sayHello:function(){

    console.log('Hello World');

  }

}

console.log(originObj); // {name: "axuebin", sayHello: ƒ}

const cloneObj = deepClone(originObj);

console.log(cloneObj); // {name: "axuebin", sayHello: ƒ}

也可以。搞定。