判断数据类型--js(十九)

89 阅读2分钟

判断数据类型

1、typeof

  • 缺点: 引用数据类型判断的时候不太准确
        // 1. typeof
        console.log(typeof('100'))//string
        console.log(typeof(100))//number
        console.log(typeof(null))//object
        console.log(typeof({}))//object
        console.log(typeof([]))//object
        console.log(typeof(function () {}))//function

2、constructor

  • 语法: 数据.constructor === 构造函数 , 我们可以通过 对比他等于那个构造函数, 然后确认他是哪个数据类型
  • 缺点:
    • undefined 和 null 不能使用
    • constructor 其实就是一个对象内部的一个属性, 是有可能被修改的
        // 2. constructor
        console.log(Array)//ƒ Array() { [native code] }
        console.log(Array.prototype)//[constructor: ƒ, at: ƒ, concat: ƒ, copyWithin: ƒ, fill: ƒ, …]
        console.log(Array.prototype.constructor)//ƒ Array() { [native code] }

        Array.prototype.constructor = '一个错误的修改'

        console.log(Array)//ƒ Array() { [native code] }
        console.log(Array.prototype)//[constructor: '一个错误的修改', at: ƒ, concat: ƒ, copyWithin: ƒ, fill: ƒ, …]

        console.log(Array.prototype.constructor)//一个错误的修改


        const arr = [1, 2, 3]
        console.log(Array.prototype === arr.__proto__)//true
        console.log(Array.prototype.constructor)//一个错误的修改
        //以下两个是false是因为上面修改了Array
        console.log('arr', arr.__proto__.constructor === Array)//false
        console.log('arr', arr.constructor === Array)//false
        console.log('arr', arr.constructor === Function)//false
        console.log('arr', arr.constructor === Object)//false
        const obj = {}
        console.log(obj.constructor === Object)//true
        console.log(obj.constructor === Array)//false
        const fn = () => {}
        console.log('fn', fn.constructor === Function)//true
        console.log('fn', fn.constructor === Object)//false

        const un = undefined
        const nu = null
        const num = 100
        const str = 'QF001'

        console.log(un.constructor) // undefined 不能使用
        console.log(nu.constructor) // null 不能使用
        console.log(num.constructor) // 能够正常使用-ƒ Number() { [native code] }
        console.log(str.constructor) // 能够正常使用-ƒ String() { [native code] }

3、instanceof

  • 语法:数据 instanceof 构造函数
  • 缺点:
    • undefined 和 null 不能使用
    • 引用数据类型, 有可能会被识别对 对象类型
        // 3. instanceof
        const arr = []
        console.log(arr instanceof Array)//true
        console.log(arr instanceof Function)//false
        console.log(arr instanceof Object)//true
        const fn = function () {}
        console.log(fn instanceof Function)//true
        console.log(fn instanceof Array)//false
        console.log(fn instanceof Object)//true
        //以下两个报错
        const un = undefined
        const nu = null
        console.log(un instanceof Undefined)
        console.log(un instanceof Null)

4、 Object.prototype.toString.call(要判断数据类型的数据)

  • 能够判断 JS 中 所有的 数据类型
        console.log(Object)  // 一个内置的构造函数
        console.log(Object.prototype)    // 构造函数的原型对象
        console.log(Object.prototype.toString)   // 原型对象中的一个属性, 值是一个函数
        console.log(Object.prototype.toString.call([]))  // 调用了 函数的 call 这个方法, 修改了 前边函数内部的 this


        console.log(Object.prototype.toString.call([]))//[object Array]
        console.log(Object.prototype.toString.call({}))//[object Object]
        console.log(Object.prototype.toString.call(100))//[object Number]
        console.log(Object.prototype.toString.call('100'))//[object String]
        console.log(Object.prototype.toString.call(undefined))//[object Undefined]
        console.log(Object.prototype.toString.call(null))//[object Null]
        console.log(Object.prototype.toString.call(function () { }))//[object Function]
        console.log(Object.prototype.toString.call(true))//[object Boolean]
        console.log(Object.prototype.toString.call(/\d/))//[object Regexp]