JavaScript判断数据类型

一、 typeof

    typeof 'a' // 'string'
    typeof 1   // 'number' 
    typeof true // 'boolean'
    typeof undefined // 'undefined'
    typeof Symbol('a') // 'symbol'
    typeof 1n // 'bigint'

    typeof null // 'object'

    typeof function() {} // 'function'
    typeof [] // 'object'
    typeof {} // 'object'
    typeof /a/ // 'object'
    typeof new Date() // 'object'
    typeof new Error() // 'object'
    typeof new Map() // 'object'
    typeof new Set() // 'object'

• 由上面的例子可以看出：
  1. typeof 是可以判断出了null以外的原始类型（原始类型：Null、Undefined、Number、String、Boolean、Symbol、BigInt，也就是除了对象类型 Object外都是原始类型）
  2. typeof 只能判断对象类型中的Function，其他都判断不了，都会显示为 object。
• 应用： 我们可以使用 typeof 来检测一个变量是否存在，如 if(typeof a!="undefined"){}，变量a存在时才会进入if里面，如果 a 不存在（未声明）， 则会报错。

二、 instanceof

    console.log(1 instanceof Number) // false
    console.log(new Number(1) instanceof Number) // true

    const arr = []
    console.log(arr instanceof Array) // true
    console.log(arr instanceof Object) // true

    const Fn = function() {
        this.name = '构造函数'
    }
    Fn.prototype = Object.create(Array.prototype)
    let a = new Fn()
    console.log(a instanceof Array) // true

• 由上面例子可以看出：
  1. 该方法是用来检测引用(对象)类型，值类型都会返回false。
  2. 格式为：a instanceof B，左边是待检测的对象，右边是对象的类。如果左边的对象是右边的实例，就会返回true，否则返回false。
  3. 也可以理解为：a 的原型链上是否存在 B 的构造函数。
  4. 检测所有new操作符所创建的对象都会返回true。
  5. 检测null和undefined会返回false。

三、 constructor

      const c = 100
      const d = 'warbler'
      const e = trueconst f = Symbol('f')
      const reg = /^[a-zA-Z]{5,20}$/
      const foo = () => { }
      const arr = []
      const obj = {}
      const date = new Date();
      const error = new Error();
      console.log(c.constructor === Number) //=> true
      console.log(d.constructor === String) //=> true
      console.log(e.constructor === Boolean) //=> true
      console.log(f.constructor === Symbol) //=> true
      console.log(reg.constructor === RegExp) //=> true
      console.log(foo.constructor === Function) //=> true
      console.log(arr.constructor === Array) //=> true
      console.log(obj.constructor === Object) //=> true
      console.log(date.constructor === Date) //=> true
      console.log(error.constructor === Error) //=> true

• 由上面例子可以看出：
  1. 除了 undefined 和 null 之外，其他类型都可以通过 constructor 属性来判断类型。

四、 Object.prototype.toString.call()

    Object.prototype.toString({}) // '[object Object]'

    Object.prototype.toString.call({}) // '[object Object]'
    Object.prototype.toString.call('a') // '[object String]'
    Object.prototype.toString.call(1) // '[object Number]'
    Object.prototype.toString.call(true) // '[object Boolean]'
    Object.prototype.toString.call(null) // '[object Null]'
    Object.prototype.toString.call(undefined) // '[object Undefined]'
    Object.prototype.toString.call(Symbol('a')) // '[object Symbol]'
    Object.prototype.toString.call(11n) // '[object BigInt]'
    Object.prototype.toString.call(/a/) // '[object RegExp]'
    Object.prototype.toString.call(new Date()) // '[object Date]'
    Object.prototype.toString.call([0, 1, 2]) // '[object Array]'
    Object.prototype.toString.call(function() {}) // '[object Function]'
    Object.prototype.toString.call(new Error()) // '[object Error]'
    Object.prototype.toString.call(new Set()) // '[object Set]'
    Object.prototype.toString.call(new Map()) // '[object Map]'

• 由上面例子可以看出：
  1. Object.prototype.toString() 这个函数作用就是，返回当前调用者的对象类型。
  2. Object.prototype.toString.call()，返回：[object 数据类型]。

  3. Object.prototype.toString.call()为什么要加call()?

     • 因为Object.prototype.toString()返回的是调用者的类型。不论你toString()本身的入参写的是什么，在Object.prototype.toString()中，他的调用者永远都是Object.prototype; 所以，在不加call()情况下，我们的出来的结果永远都是 [object Object]。
     • 而加上call(),是为了改变Object.prototype.toString这个函数都指向。让Object.prototype.toString这个方法指向我们所传入的数据。
• 利用Object.prototype.toString.call()封装一个判断数据类型的函数:

    const getPrototype = (item) => Object.prototype.toString.call(item).split(' ')[1].replace(']', '');
    console.log(getPrototype('abc')) //=> String