js 实现深拷贝（全）

一、使用第三方库

使用 lodash 的 cloneDeep() 方法（详情可见 lodash 中文官网）

import lodash from 'lodash';

let obj = {
  a: {
    b: '阿潔'
  },
  c: '深拷贝'
}

const newObj = lodash.cloneDeep(obj)

二、简单深拷贝

除了基本数据类型（null、string、boolean、undefined、number、symbol），引用数据类型中 如果对象中不存在时间类型和正则表达式等类型对象，则可用简单的JSON序列化进行转化。

let cloneObj = JSON.parse(JSON.stringify(obj))

注意：如果对象内容项为undefined,null,Date,RegExp、function… 则不推荐使用此深拷贝可能会出问题

三、递归版

1、考虑到存在Date和正则表达式的深拷贝（考虑最全相对复杂的一种深拷贝）

export function cloneDeep(data) {
  //string,number,bool,null,undefined,symbol
  //object,array,date
  if (data && typeof data === "object") {
    //针对函数的拷贝
    if (typeof data === "function") {
      let tempFunc = data.bind(null);
      tempFunc.prototype = cloneDeep(data.prototype);
      return tempFunc;
    }
    // 根据不同的数据类型的深拷贝
    switch (Object.prototype.toString.call(data)) {
      case "[object String]":
        return data.toString();
      case "[object Number]":
        return Number(data.toString());
      case "[object Boolean]":
        return new Boolean(data.toString());
      case "[object Date]":
        return new Date(data.getTime());
      case "[object Array]":
        var arr = [];
        for (let i = 0; i < data.length; i++) {
          arr[i] = cloneDeep(data[i]);
        }
        return arr;

      //js自带对象或用户自定义类实例
      case "[object Object]":
        var obj = {};
        for (let key in data) {
          //会遍历原型链上的属性方法，可以用hasOwnProperty来控制 （obj.hasOwnProperty(prop)
          obj[key] = cloneDeep(data[key]);
        }
        return obj;
    }
  } else {
    //string,number,bool,null,undefined,symbol
    return data;
  }
}

2、不考虑Date和正则表达式的深拷贝（上面的简化版，也是常用的一种）

function cloneDeep (target) {
  // 判断是否是对象
  if (typeof target === 'object') {
    // 兼容数组与对象
    let obj = Array.isArray(target) ? [] : {}
    for (let key in target) {
      obj[key] = cloneDeep(target[key])
    }
    return obj
  } else {
    return target
  }
}