JavaScript 深拷贝方法介绍

Question

1. JSON.stringify

缺点

• 无法处理时间对象，会将时间对象形式转化为字符串形式

var test = {
    name: 'a',
    date: [new Date(1536627600000), new Date(1540047600000)], // 对象
  }

  let b;
  b = JSON.parse(JSON.stringify(test))
console.log(b) // {date: (2) ["2018-09-11T01:00:00.000Z", "2018-10-20T15:00:00.000Z"], name: "a"}

• 无法转换正则表达式
• 无法转换函数、undefined，会丢失这个属性
• 如果 obj 里有 NaN、Infinity 和-Infinity，则序列化的结果会变成 null
• 只能序列化对象的可枚举的自有属性
• 如果对象中存在循环引用的情况也无法正确实现深拷贝

2. 递归实现深拷贝

function deepClone(obj, hash = new WeakMap()) {
  if (obj === null) return obj; // 如果是 null 或者 undefined 我就不进行拷贝操作
  if (obj instanceof Date) return new Date(obj);
  if (obj instanceof RegExp) return new RegExp(obj);
  // 可能是对象或者普通的值  如果是函数的话是不需要深拷贝
  if (typeof obj !== "object") return obj;
  // 是对象的话就要进行深拷贝
  if (hash.get(obj)) return hash.get(obj); // weakmap 存储对象会产生一个新的引用，所以修改原对象不会影响到 weakmap
  let cloneObj = new obj.constructor();
  // 找到的是所属类原型上的 constructor,而原型上的 constructor 指向的是当前类本身
  hash.set(obj, cloneObj);
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      // 实现一个递归拷贝
      cloneObj[key] = deepClone(obj[key], hash);
    }
  }
  return cloneObj;
}