深拷贝的方法

1.JSON转换

  1. var targetObj = JSON.parse(JSON.stringify(copyObj))
  2. let arr4 = JSON.parse(JSON.stringify(arr))

缺点：
（1）如果对象里有函数,函数无法被拷贝下来
（2）无法拷贝copyObj对象原型链上的属性和方法
（3）当数据的层次很深，会栈溢出

2.普通递归函数

  1. function deepCopy( source ) {
  2. if (!isObject(source)) return source; //如果不是对象的话直接返回
  3.     let target = Array.isArray( source ) ? [] : {} //数组兼容
  4.     for ( var k in source ) {
  5.         if (source.hasOwnProperty(k)) {
  6.             if ( typeof source[ k ] === 'object' ) {
  7.                 target[ k ] = deepCopy( source[ k ] )
  8.             } else {
  9.                 target[ k ] = source[ k ]
  10.             }
  11.         }
  12.     }
  13.     return target
  14. }
  16. function isObject(obj) {
  17.     return typeof obj === 'object' && obj !== null
  18. }

缺点：
（1）无法保持引用
（2）当数据的层次很深，会栈溢出

3.防栈溢出函数

  1. function cloneLoop(x) {
  2.     const root = {};
  4.     // 栈
  5.     const loopList = [
  6.         {
  7.             parent: root,
  8.             key: undefined,
  9.             data: x,
  10.         }
  11.     ];
  13.     while(loopList.length) {
  14.         // 深度优先
  15.         const node = loopList.pop();
  16.         const parent = node.parent;
  17.         const key = node.key;
  18.         const data = node.data;
  20.         // 初始化赋值目标，key为undefined则拷贝到父元素，否则拷贝到子元素
  21.         let res = parent;
  22.         if (typeof key !== 'undefined') {
  23.             res = parent[key] = {};
  24.         }
  26.         for(let k in data) {
  27.             if (data.hasOwnProperty(k)) {
  28.                 if (typeof data[k] === 'object') {
  29.                     // 下一次循环
  30.                     loopList.push({
  31.                         parent: res,
  32.                         key: k,
  33.                         data: data[k],
  34.                     });
  35.                 } else {
  36.                     res[k] = data[k];
  37.                 }
  38.             }
  39.         }
  40.     }
  42.     return root;
  43. }

优点：
（1）不会栈溢出
（2）支持很多层级的数据

  1. function copyObject(orig) {
  2.     var copy = Object.create(Object.getPrototypeOf(orig));
  3.     copyOwnPropertiesFrom(copy, orig);
  4.     return copy;
  5.   }
  8.   function copyOwnPropertiesFrom(target, source) {
  9.     Object
  10.     .getOwnPropertyNames(source)
  11.     .forEach(function (propKey) {
  12.       var desc = Object.getOwnPropertyDescriptor(source, propKey);
  13.       Object.defineProperty(target, propKey, desc);
  14.     });
  15.     return target;
  16.   }
  18.   var obj = {
  19.     name: 'Jack',
  20.     age: '32',
  21.     job: 'developer'
  22.   };
  24.   var obj2 = copyObject(obj);
  25.   console.log(obj2);
  26.   obj.age = 39;
  27.   obj.name = 'Tom';
  28.   console.log(obj);
  29.   console.log(obj2);