JS中判断数据类型的方法

typeof 、instanceof、Object.prototype.toString、jQuery.type()

1、 typeof——返回对应的数据类型。

作用:typeof 操作符返回一个字符串,表示未经计算的操作数的类型。
语法: 

typeof operand

typeof(operand)

 例:

   var str = '字符串'
   var num = 111
   var obj = {}
   var arr = [1,2,3]
   var fun = function(){
       console.log('函数')
   }
   let s = Symbol()
   typeof(str)  // 'string'
   typeof(num)  // 'number'
   typeof(true)  // 'boolean'
   typeof(obj)  // 'object'
   typeof(arr)  // 'object'
   typeof(null) // 'object'
   typeof(undefined) // 'undefined'
   typeof(fun)  // 'function'
   typeof(s) // symbol

 问题:如果是引用类型(复杂数据类型:对象和数组),那么返回的都是Object,无法具体区分

2、 instanceof——只适用于对象类型,不适用于简单类型的数据类型,返回boolean值

   作用:1:识别对象类型;
              2:判断一个对象是否属于某个构造函数的实例
   语法:变量名 instanceof 数据类型    ||     实例对象名 instaneof 构造函数

 例1:只要是对象类型的都可以区分

arr instanceof Array             // true
new Date() instanceof Date       // true

例2:使用instanceof来检验F是否属于构造函数fn的实例

var F = new fn()              // 实例化构造函数
F instanceof fn               // true, 说明F是属于fn的实例

 问题:对于不同的构造函数,同一个实例都返回了true,如下F对Object同样返回了true

F instanceof Object             // true 

instanceof原理:左边是一个实例对象,右边是一个构造函数,instanceof会检查构造函数的原型对象prototype是否在左边对象的原型链上,有则返回true,否则返回false.

 instanecof内部执行函数:

instanceof (A, B) = {
  var L = A.__proto__
   var R = B.prototype
   if(L === R) {
       // A的内部属性__proto__指向B的原型对象
       return true
   }
   return false
}

那么我们来看下左边对象的原型链以及右边函数的原型对象上都发生了什么

F.__proto__===fn.prototype                                      // true 实例化对象F的原型指向fn的原型对象
F.__proto__.__proto__||fn.prototype.__proto__===Object.prototype  // true fn的原型又指向Object的原型对象
Object.prototype.__proto__                                      // null

说明从F——fn——Object都在一条原型链上,其中fn和Object的prototype属性都存在于F所在的这条原型链上,所以,F针对于两个函数都返回了true

3、Object.prototype.toString

作用:可以说不管是什么类型,它都可以立即判断出
语法:Object.prototype.toString.call(变量名)

toString是Object原型对象上的一个方法,该方法默认返回其调用者的具体类型,更严格的讲,是 toString运行时this指向的对象类型, 返回的类型

例:

    var str = 'hello'
    console.log(Object.prototype.toString.call(str))    // '[object String]'

    var bool = true
    console.log(Object.prototype.toString.call(bool))   // '[object Boolean]'

    var num = 123
    console.log(Object.prototype.toString.call(num))    // '[object Number]'

    var nul = null
    console.log(Object.prototype.toString.call(nul))    // '[object Null]'

    var und = undefined
    console.log(Object.prototype.toString.call(und))    // '[object Undefined]'

    var oDate = new Date()
    console.log(Object.prototype.toString.call(oDate))  // '[object Date]'

    var json = {}
    console.log(Object.prototype.toString.call(json))   // '[object Object]'

    var arr = []
    console.log(Object.prototype.toString.call(arr))    // '[object Array]'

    var reg = /a/
    console.log(Object.prototype.toString.call(reg))    // '[object RegExp]'

    var fun = function(){}
    console.log(Object.prototype.toString.call(fun))    // '[object Function]'

    var error = new Error()
    console.log(Object.prototype.toString.call(error))  // '[object Error]'

从这个结果也可以看出,不管是什么类型的,Object.prototype.toString.call();都可以判断出其具体的类型。

4、jQuery.type()

作用:判断数据类型。PS.其判断的结果显示都是小写的字符串形式
语法:jQuery.type(变量名)

例:包括日期、正则、undefined、null等都是可以判断的

jQuery.type(str)   // string
jQuery.type(num)   // number
jQuery.type(arr)   // array
jQuery.type(obj)   // object
jQuery.type(fn)    // funtion

总结:

优缺点typeofinstanceofObject.prototype.toString.calljQuery.type()
优点使用简单能检测出引用类型检测出所有的类型判断所有的数据类型
缺点只能检测出基本类型(除null)不能检测出基本类型,且不能跨iframeIE6下,undefined和null均为Object

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

__畫戟__

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值