js深度克隆可以做什么

JavaScript010

js深度克隆可以做什么,第1张

浅拷贝:只复制对象的引用,此时对对象内容的修改直接作用于原对象内容。

深拷贝(深度克隆):复制对象的内容,此时对对象内容的修改是独立的,不会影响到之前的对象。

所以这是编程时的选择问题,如果你想拥有当前对象内容的复制,从而独立地对它进行操作,就用深度克隆

function deepClone(data) {

      const type = this.judgeType(data)

      let obj

      if (type === 'array') {

        obj = []

      } else if (type === 'object') {

        obj = {}

      } else {

    // 不再具有下一层次

        return data

      }

      if (type === 'array') {

        // eslint-disable-next-line

        for (let i = 0, len = data.lengthi <leni++) {

          obj.push(this.deepClone(data[i]))

        }

      } else if (type === 'object') {

        // 对原型上的方法也拷贝了....

        // eslint-disable-next-line

        for (const key in data) {

          obj[key] = this.deepClone(data[key])

        }

      }

      return obj

    }

function  judgeType(obj) {

  // tostring会返回对应不同的标签的构造函数

      const toString = Object.prototype.toString

      const map = {

        '[object Boolean]': 'boolean',

        '[object Number]': 'number',

        '[object String]': 'string',

        '[object Function]': 'function',

        '[object Array]': 'array',

        '[object Date]': 'date',

        '[object RegExp]': 'regExp',

        '[object Undefined]': 'undefined',

        '[object Null]': 'null',

        '[object Object]': 'object',

      }

      if (obj instanceof Element) {

        return 'element'

      }

      return map[toString.call(obj)]

    }