JavaScript实现深拷贝

深拷贝

思路：递归方法实现深度克隆原理：遍历对象、数组直到里边都是基本数据类型，然后再去复制，就是深度拷贝。
有种特殊情况需注意就是对象存在循环引用的情况，即对象的属性直接的引用了自身的情况，解决循环引用问题，我们可以额外开辟一个存储空间，来存储当前对象和拷贝对象的对应关系，当需要拷贝当前对象时，先去存储空间中找，有没有拷贝过这个对象，如果有的话直接返回，如果没有的话继续拷贝，这样就巧妙化解的循环引用的问题。

function deepClone(obj, hash = new WeakMap()) {
  if (obj === null) return obj;
  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);

  // 简单来说 new xxx.constructor 可以拿到obj的类型
  // 复杂来说 使用了原对象的构造方法，所以它可以保留对象原型上的数据，如果直接使用普通的{}，那么原型必然是丢失了的。
  let cloneObj = new obj.constructor();

  hash.set(obj, cloneObj);
  // 拿到待拷贝对象的key，进行递归拷贝
  for (let key in obj) {
    // for in 循环同样在查找对象属性时遍历原型链上的所有属性，
    // 使用 hasOwnProperty 方法， 这将会避免原型对象扩展带来的干扰
    // hasOwnProperty 可以用来排除原型链上的属性
    // if (obj.hasOwnProperty(key)) {
    //   cloneObj[key] = deepClone(obj[key], hash);
    // }

    // 又或是使用其他方法循环来
    const isArray = Array.isArray(obj)
    const keys = isArray? obj : Object.keys(obj) 
    let i = 0;
    while(i <= keys.length-1) {
      cloneObj[keys[i]] = deepClone(obj[keys[i]], hash);
      i++;
    }

    // 对象
  }

  return cloneObj;

}
// 原型上的方法并不喜欢被拷贝下来
Object.prototype.bar = {a:'test'}
let obj = { name: 1, address: { x: 100 } };
obj.o = obj; // 对象存在循环引用的情况
let d = deepClone(obj);
obj.address.x = 200;

console.log(d);

function deepClone(obj, hash = new WeakMap()) {
  if (obj === null) return obj;
  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);
  let cloneObj = new obj.constructor();

  hash.set(obj, cloneObj);
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      cloneObj[key] = deepClone(obj[key], hash);
    }
  }
  return cloneObj;
}
Object.prototype.bar = {a:'test'}
let obj = { name: 1, address: { x: 100 } };
obj.o = obj;
let d = deepClone(obj);
obj.address.x = 200;
console.log(d);

声明

• 本文属于读书笔记一类，是作者在学习 《如何写出一个惊艳面试官的深拷贝?》 一文途中，以文章中内容为蓝本，辅以个人微末的道行“填写”完成，推荐阅读大佬原文章，定有收获
• 欢迎大佬斧正