为什么我一定要用Object.prototype.toString.call而不是typeof

157 阅读3分钟

6eff1065491866f08a695db0d37ac6be_695YZakHkGKIjEJESBAgAABAgQIECBAgMCjgNP7uJrOBAgQIECAAAECBAgQIJAEBrEL+2lF3YACAAAAAElFTkSuQmCC.png

本来想自己写的,但是发现有一个jy的文章写的可以,就直接引用了

三种类型判断的区别和原理解析(typeof/instanceof/Object.prototype.toString)

个人表示:写程序最忌讳的就是结果不唯一

1+1 = 2 这肯定是不用考虑咯。这个结果也是一定是唯一的咯,不管是在哪台计算机上运行这个都是等于2吧,总不能出现一个等于3吧。但不能排除有的写出像被智子干扰了一样,每次的结果都不一样☻

这就是我推荐一定要用Object.prototype.toString.call判断数据类型而不是使用typeof。不仅仅是唯一性兼容性也比typeof好

当然,这里出现的不唯一性也是对typeof了解的不多,但是个人建议能用Object.prototype.toString.call判断就不要用typeof,避免不唯一性,毕竟js是一门弱语言代码,变量的数据类型是可以实时变化的

我自己包装的代码

代码地址

也可以直接复制下面的代码,没有引用其他的代码

/**
 * 作者:致心 vue项目所有文件命名全部采用中划线分隔   typeOfUtils
 * 创建时间:2021/3/5 14:50
 */

/**
 * 引用检测
 */
class CitationDetection {
  private list: any[] = [] // 传入引用进行判断

  add(value) {
    if (typeOfUtils.isNotMyBaseType(value)) {
      this.list.push(value)
    }
  }

  has(value) {
    const find = this.list.find(i => i === value)
    return !!find
  }

  notHas(value) {
    return !this.has(value)
  }

  /**
   *
   * @param value
   * @param cit {CitationDetection}
   * @returns {boolean}
   */
  static isEmpty(value, cit) {
    if (cit.has(value)) {
      return false
    }
    if (typeOfUtils.isNull(value) || typeOfUtils.isUndefined(value)) {
      return true
    }
    if (typeOfUtils.isArray(value) && value.length === 0) {
      return true
    }
    if (typeOfUtils.isString(value) && value.length === 0) {
      return true
    }
    if (typeOfUtils.isNumber(value) && isNaN(value)) {
      return true
    }
    if (typeOfUtils.isObject(value)) {
      if (Object.keys(value).length === 0) {
        return true
      } else {
        const list = Object.keys(value)
        let count = 0
        list.forEach(i => {
          cit.add(value[i])
          if (CitationDetection.isEmpty(value[i], cit)) {
            count++
          }
        })
        return count === list.length
      }
    }
    return false
  }
}

export default class typeOfUtils {
  static isType(val) {
    return Object.prototype.toString.call(val)
  }

  static isString(value) {
    return typeOfUtils.isType(value) === '[object String]'
  }

  static isNotString(value) {
    return !typeOfUtils.isString(value)
  }

  static isNumber(value) {
    return typeOfUtils.isType(value) === '[object Number]'
  }

  static isNotNumber(value) {
    return !typeOfUtils.isNumber(value)
  }

  static isFloat(value) {
    if (typeOfUtils.isNotNumber(value)) {
      return false
    }
    const string = value.toString()
    return string.indexOf('.') !== -1
  }

  static isNotFloat(value) {
    return !typeOfUtils.isFloat(value)
  }

  static isBoolean(value) {
    return typeOfUtils.isType(value) === '[object Boolean]'
  }

  static isNotBoolean(value) {
    return !typeOfUtils.isBoolean(value)
  }

  static isSymbol(value) {
    return typeOfUtils.isType(value) === '[object Symbol]'
  }

  static isNotSymbol(value) {
    return !typeOfUtils.isSymbol(value)
  }

  static isUndefined(value) {
    return typeOfUtils.isType(value) === '[object Undefined]'
  }

  static isNotUndefined(value) {
    return !typeOfUtils.isUndefined(value)
  }

  static isNull(value) {
    return typeOfUtils.isType(value) === '[object Null]'
  }

  static isNotNull(value) {
    return !typeOfUtils.isNull(value)
  }

  static isFunction(value) {
    return typeOfUtils.isType(value) === '[object Function]'
  }

  static isNotFunction(value) {
    return !typeOfUtils.isFunction(value)
  }

  static isDate(value) {
    return typeOfUtils.isType(value) === '[object Date]'
  }

  static isNotDate(value) {
    return !typeOfUtils.isDate(value)
  }

  static isArray(value) {
    return typeOfUtils.isType(value) === '[object Array]'
  }

  static isNotArray(value) {
    return !typeOfUtils.isArray(value)
  }

  static isRegExp(value) {
    return typeOfUtils.isType(value) === '[object RegExp]'
  }

  static isNotRegExp(value) {
    return !typeOfUtils.isRegExp(value)
  }

  static isError(value) {
    return typeOfUtils.isType(value) === '[object Error]'
  }

  static isNotError(value) {
    return !typeOfUtils.isError(value)
  }

  static isHTMLDocument(value) {
    const d = document.createElement('div')
    try {
      d.appendChild(value.cloneNode(true))
      return value.nodeType === 1
    } catch (e) {
      return value === window || value === document
    }
  }

  static isNotHTMLDocument(value) {
    return !typeOfUtils.isHTMLDocument(value)
  }

  static isGlobal(value) {
    return typeOfUtils.isType(value) === '[object global]'
  }

  static isNotGlobal(value) {
    return !typeOfUtils.isGlobal(value)
  }

  static isObject(value) {
    return typeOfUtils.isType(value) === '[object Object]'
  }

  static isNotObject(value) {
    return !typeOfUtils.isObject(value)
  }

  static isPromise(value) {
    return typeOfUtils.isType(value) === '[object Promise]'
  }

  static isNotPromise(value) {
    return !typeOfUtils.isPromise(value)
  }

  /**
   * @Description :判断值是不是空,判断为空的数据有 [],{}'',NaN,null,Undefined
   * @Author :致心
   * @Date :2021/3/10 17:01
   * @param value
   * @returns {boolean}
   */
  static isEmpty(value) {
    const cit = new CitationDetection()
    return CitationDetection.isEmpty(value, cit)
  }

  /**
   * @Description :判断值是不是不为空
   * @Author :致心
   * @Date :2021/3/31 10:19
   * @param value
   * @returns {boolean}
   */
  static isNotEmpty(value) {
    return !typeOfUtils.isEmpty(value)
  }

  /**
   * @Description :判断对象里面多个属性不为空
   * @Author :致心
   * @Date :2021/4/29 15:41
   * @param value {Object}
   * @param attrs {Array} 传入字符数组
   * @returns {boolean}
   */
  static objectAttrsNotEmpty(value, attrs) {
    if (typeOfUtils.isNotObject(value)) {
      throw new Error('传入的value不是对象')
    }
    if (typeOfUtils.isNotArray(attrs)) {
      throw new Error('传入的attrs不是数组')
    }
    if (typeOfUtils.isEmpty(value)) {
      throw new Error('传入的value不能为空')
    }
    if (typeOfUtils.isEmpty(attrs)) {
      throw new Error('传入的attrs不能为空')
    }
    let count = 0
    attrs.forEach(i => {
      if (typeOfUtils.isString(i)) {
        count++
      }
    })
    if (count !== attrs.length) {
      throw new Error('传入的attrs有数据错误')
    }
    count = 0
    attrs.forEach(i => {
      if (typeOfUtils.isNotEmpty(value[i])) {
        count++
      }
    })
    return count === attrs.length
  }

  /**
   * @Description :判断对象里面多个属性有空
   * @Author :致心
   * @Date :2021/4/30 15:03
   * @param value {Object}
   * @param attrs {Array} 传入字符数组
   * @returns {boolean}
   */
  static objectAttrsHasEmpty(value, attrs) {
    return !typeOfUtils.objectAttrsNotEmpty(value, attrs)
  }

  /**
   * instanceof运算符用于检测构造函数的prototype属性是否出现在某个实例对象的原型链上。
   * @param left
   * @param right
   * @returns {boolean}
   */
  static instanceof(left, right) {
    // eslint-disable-next-line no-proto
    let implicitPrototype = left.__proto__
    const displayPrototype = right.prototype
    while (implicitPrototype) {
      if (implicitPrototype === displayPrototype) return true
      // eslint-disable-next-line no-proto
      implicitPrototype = implicitPrototype.__proto__
    }
    return false
  }

  /**
   * 我的基础类型判断
   * @param val
   * @return {boolean}
   */
  static isMyBasetype(val) {
    return !(typeOfUtils.isArray(val) ||
      typeOfUtils.isFunction(val) ||
      typeOfUtils.isDate(val) ||
      typeOfUtils.isPromise(val) ||
      typeOfUtils.isObject(val))
  }

  /**
   * 我的基础类型判断
   * @param val
   * @return {boolean}
   */
  static isNotMyBaseType(val) {
    return !typeOfUtils.isMyBasetype(val)
  }
}

最后

欢迎关注公众号致心空间:O(∩_∩)O😁

致心空间