【九月打卡】第11天 手写深拷贝

课程名称：2周刷完100道前端优质面试真题
课程章节：第8章 前端面试技能拼图6： 编写高质量代码 - 正确，完整，清晰，鲁棒
主讲老师：双越
课程内容：
今天学习的内容包括：
8-23 手写JS深拷贝-考虑各种数据类型和循环引用

课程收获：

JSON.parse(JSON.stringify(o)) 缺陷：

• 函数、set、map 无法转换
• 循环引用直接报错
• 简单结构可用

Object.assign() 只处理最外面一层

考虑 set、map、循环引用的手写深拷贝

思路：
typeof map set obj arr 都是 object。
每一次调用的对象，都存到weakMap里，出现循环引用直接返回即可，避免一直递归。
再对深拷贝对象是 map \ set \ array \ object 四种情况分别处理。
map: new Map, 遍历对于 key value都做递归处理 并 set。
set： new Set，遍历后对 value 递归并依次 add。
array： map 对 value 递归并返回。
object: for in 遍历，并对value 递归后依据 key 赋值。

    const clone = (obj, map = new WeakMap()) => {
      if (typeof obj !== "object" || obj == null) {
        return obj;
      }
      const objFromMap = map.get(obj);
      if (objFromMap) {
        return objFromMap;
      } else {
        let target = {};
        map.set(obj, target);
        if (obj instanceof Map) {
          target = new Map();
          obj.forEach((v, k) => {
            const v1 = clone(v, map);
            const k1 = clone(k, map);
            target.set(k1, v1);
          });
        }
        if (obj instanceof Set) {
          target = new Set();
          obj.forEach((v) => {
            const v1 = clone(v, map);
            target.add(v1);
          });
        }
        if (obj instanceof Array) {
          target = obj.map((item) => clone(item, map));
        }
        for (const key in obj) {
          const val = obj[key];
          const val1 = clone(val, map);
          target[key] = val1;
        }
        return target;
      }
    };
    const a = {
      set: new Set([10, 20, 30]),
      map: new Map([
        ["x", 10],
        ["y", 20],
      ]),
      info: {
        city: "北京",
      },
      fn: () => {
        console.info(100);
      },
    };
    a.self = a;
    console.log("clone", clone(a));

以上，结束。