js中数据类型检测

js中检测数据类型的4种方案

方案一 typeof()

上述图片涵盖了几乎js中所有的数据类型,可以看出 typeof对于普通数据类型是没有任何问题.但是对于复杂数据类型的检测成为了Object.可以看出typeof只对普通数据类型有效.symbol也是属于基本数据类型,是可以正确检测的,上方的symbol忘记()所以返回了function

方案二 instanceof

如上图所示可以看出instanceof对于null和undefined这两张数据会显得力不从心,并且instanceof是通过new 这个关键字来进行数据类型检测的所以直接定义的数字和字符串也会返回false.

方法三 constructor

<script>

   let Fu = function (){}
   Fu.prototype =new Array()
   let F = new Fu()
   console.log((F).constructor === Fu)   //false
   console.log((F).constructor === Array)   //false
   
   console.log((1).constructor===Number)  //true
   console.log(('').constructor===String)  //true
   console.log((true).constructor===Boolean)  //true
   console.log((null).constructor===null )   // Uncaught TypeError: Cannot read property 'constructor' of null 
   console.log((undefined).constructor===undefined)  //TypeError: Cannot read property 'constructor' of undefined
   console.log(({}).constructor===Object)  //true
   console.log(([]).constructor===Array) //true
   console.log((new RegExp()).constructor===RegExp)  //true
   console.log((Symbol).constructor===Symbol)   //false
   console.log((Map).constructor===Map)   //false
   console.log((new Set()).constructor===Set)   //true
</script>

constructor该方法可以看出声明一个构造函数并且将它的原型指向array,所返回的值也会和我们想象中的不一样,并且它同样不认识null和undefined这两个老大难,会直接报错.

方法四 Object.prototype.toString.call()

<script>
console.log(Object.prototype.toString.call(null))  //[object Null]
console.log(Object.prototype.toString.call(undefined))  //[object Undefined]
console.log(Object.prototype.toString.call(''))  //[object String]
console.log(Object.prototype.toString.call(123))  //[object Number]
console.log(Object.prototype.toString.call(true))  //[object Boolean]
console.log(Object.prototype.toString.call(new Date()))  //[object Date]
console.log(Object.prototype.toString.call(new RegExp())) //[object RegExp]
console.log(Object.prototype.toString.call(new Set()))  //[object Set]
console.log(Object.prototype.toString.call({}))   //[object Object]
console.log(Object.prototype.toString.call([]))   //[object Array]
console.log(Object.prototype.toString.call(Symbol))  //[object Function]
console.log(Object.prototype.toString.call(Map))  //[object Function]
</script>

Object.prototype.toString.call()为现在一个比较完美的解决方案,如果大家观看过jQuery源码的话可以看出jq中封装的就是这个方法

好啦，今天的分享就到这儿啦，我们下次见啦~ლ(°◕‵ƹ′◕ლ)