深拷贝

作者: xurna | 来源:发表于2019-02-27 19:41 被阅读0次

    准备

    1. WeakMap类型
      WeakMaps 保持了对键名所引用的对象的弱引用,而且WeakMap 只接受对象作为键名,以下会报错:
    const map = new WeakMap();
    map.set(1, 2);
    // TypeError: Invalid value used as weak map key
    map.set(null, 2);
    // TypeError: Invalid value used as weak map key
    

    一个对象若只被弱引用所引用,则被认为是不可访问(或弱可访问)的,并因此可能在任何时刻被回收。

    举个栗子:

    const key = new Array(5 * 1024 * 1024);
    const arr = [ [key, 1]];
    key = null
    

    使用这种方式,我们其实建立了 arr 对 key 所引用的对象(我们假设这个真正的对象叫 Obj)的强引用。所以当你设置 key = null 时,只是去掉了 key 对 Obj 的强引用,并没有去除 arr 对 Obj 的强引用,所以 Obj 还是不会被回收掉。

    所以引入了WeakMap类型:

    const wm = new WeakMap();
    let key = new Array(5 * 1024 * 1024);
    wm.set(key, 1);
    key = null;
    

    当我们设置 wm.set(key, 1) 时,其实建立了 wm 对 key 所引用的对象的弱引用,但因为 let key = new Array(5 * 1024 * 1024) 建立了 key 对所引用对象的强引用,被引用的对象并不会被回收,但是当我们设置 key = null 的时候,就只有 wm 对所引用对象的弱引用,下次垃圾回收机制执行的时候,该引用对象就会被回收掉。

    总结:只要所引用的对象的其他引用都被清除,垃圾回收机制就会释放该对象所占用的内存。也就是说,一旦不再需要,WeakMap 里面的键名对象和所对应的键值对会自动消失,不用手动删除引用。因为这样的特性,WeakMap 内部有多少个成员,取决于垃圾回收机制有没有运行,运行前后很可能成员个数是不一样的,而垃圾回收机制何时运行是不可预测的,因此 ES6 规定 WeakMap 不可遍历。

    1. 普通拷贝
    function isObj(obj) {
        return (typeof obj === 'object' || typeof obj === 'function') && obj !== null
    }
    function deepCopy(obj) {
        let tempObj = Array.isArray(obj) ? [] : {}
        for(let key in obj) {
            tempObj[key] = isObj(obj[key]) ? deepCopy(obj[key]) : obj[key]
        }
        return tempObj
    }
    

    如果遇到环,环就是对象循环引用,导致自己成为一个闭环,例如下面这个对象:

    var a = {}
    a.a = a
    

    使用上面函数拷贝,则直接报错:Uncaught RangeError: Maximum call stack size exceeded,所以引入了WeakMap解决这个环的问题。

    修改函数:

    function deepCopy(obj, hash = new WeakMap()) {
        if(hash.has(obj)) return hash.get(obj)
        let cloneObj = Array.isArray(obj) ? [] : {}
        hash.set(obj, cloneObj)
        for (let key in obj) {
            cloneObj[key] = isObj(obj[key]) ? deepCopy(obj[key], hash) : obj[key];
        }
        return cloneObj
    }
    

    则结果为:

    {a:
      a:
        a:
          a:
            a: {a: {…}}
    

    拷贝成功。使用一个WeakMap结构存储已经被拷贝的对象,每一次进行拷贝的时候就先向WeakMap查询该对象是否已经被拷贝,如果已经被拷贝则取出该对象并返回。

    1. 结构化深拷贝,解决date,reg等类型的深拷贝
      一般的拷贝不适用于date,reg等类型,例如:
    const obj = {
     arr: [111, 222],
     obj: {key: '对象'},
     a: () => {console.log('函数')},
     date: new Date(),
     reg: /正则/ig
    }
    JSON.parse(JSON.stringify(obj))
    // 拷贝后,obj中的普通对象和数组都能拷贝,然而date对象成了字符串,函数直接就不见了,正则成了一个空对象。
    {"arr":[111,222],"obj":{"key":"对象"},"date":"2019-02-27T11:36:26.563Z","reg":{}}
    

    所以使用了结构化拷贝(constructor),目前也是没解决函数的拷贝:

    /**
     * Checks if `value` is the `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
     *
     * @param {*} value The value to check.
     * @returns {boolean} Returns `true` if `value` is an object, else `false`.
     * @example
     *
     * isObject({})
     * // => true
     *
     * isObject([1, 2, 3])
     * // => true
     *
     * isObject(Function)
     * // => true
     *
     * isObject(null)
     * // => false
     */
    function isObject(value) {
      const type = typeof value
      return value != null && (type == 'object' || type == 'function')
    }
    
    /**
     * @desc 深拷贝,结构化拷贝,支持string,number,date,reg等格式,不支持function拷贝
     * @param {Any} obj 
     * @param {WeakMap} hash 
     * @return {Any}
     */
    
    function deepClone(obj, hash = new WeakMap()) {
      if (null == obj || "object" != typeof obj) return obj;
      let cloneObj
      let Constructor = obj.constructor
      console.log(1, Constructor)
      switch (Constructor) {
        case RegExp:
          cloneObj = new Constructor(obj)
          break
        case Date:
          cloneObj = new Constructor(obj.getTime())
          break
        default:
          if (hash.has(obj)) return hash.get(obj)
          cloneObj = new Constructor()
          hash.set(obj, cloneObj)
          console.log(2, hash.get(obj))
      }
      for (let key in obj) {
        console.log(3, key, cloneObj)
        cloneObj[key] = isObject(obj[key]) ? deepClone(obj[key], hash) : obj[key];
        console.log(4, key, cloneObj[key])
      }
      return cloneObj
    }
    

    参考文章

    相关文章

      网友评论

        本文标题:深拷贝

        本文链接:https://www.haomeiwen.com/subject/dhyzyqtx.html