js中数据类型判断各种坑和解决方法
1.js类型判断
console.log(typeof 123); // number
console.log(typeof true); // boolean
console.log(typeof 'str'); // string
console.log(typeof []); // object
console.log(typeof function(){}); // function
console.log(typeof {}); // object
console.log(typeof undefined); // undefined
console.log(typeof null); // object
其中数组的数据类型通过 typeof运算符获取为 object类型,null 的数据类型通过 typeof 运算符也被获取为 object类型,这样看着好像表示的不够精准,但想想人家的弱语言的性质,理解一下,具体可以自行查询下js的发展史,就可以理解大佬的厉害与随性了。
2. instanceof判断指定类型
console.log(123 instanceof Number); // false
console.log(true instanceof Boolean); // false
console.log('str' instanceof String); // false
console.log([] instanceof Array); // true
console.log(function(){} instanceof Function); // true
console.log({} instanceof Object); // true
以上结果显示,断数据类型里面还存在很多坑,不能一起进行判断,只有引用数据类型Array,Function,Object会被精准判断,但是其他如的数据类型,比如数值Number,布尔值Boolean,字符串String的值不能被instanceof运算符进行精准的判断。
MDN中的instanceof 运算符解释是用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性,就是判断对象是否是某一数据类型的实例,即为判断一个对象是否是数据类型的实例。
在上面例子中,123(数值), true (布尔值),'str'(字符串)按照上面解释理解为都不是实例,所以判断值为false。
那么怎么判断数值、布尔值和字符串这三个类型呢?
可以手动进行实例化操作,通过new Number(XXX),new Boolean(XXX),new String(XXX)进行实例化后再进行判断,此时就可以判断准确了
接着继续采坑,说一下绕不开的空值问题,js中空值可以分为两种一种是null,另一种是undefined,按照上面的操作应该是理解为null的所属类就是Null,undefined就是Undefined,然后进行手动实例化就可以了,但是
意不意外,惊不惊喜,就是不按常理出牌,就是不让你用一种方法判断所有类型= =!这里实际上是浏览器认为null,undefined不是构造器,但是在 上面的typeof运算符中null获取的结果是object类型,而undefined的结果是undefined。这里就不吐槽弱语言的特性,和js的发展史了,感兴趣的同学可以自行查询下相关历史,总之这个是个历史遗留问题。
那么问题又回到最初的起点,null和undefined怎么进行判断呢?解决办法也是很意外的,进行取反就可以了= =!是不是又是很惊喜,是的就是这样就可以进行判断了。
通过使用Object.prototype.toString.call()方法可以完美解决上面的问题,进行精准的类型判断,并返回一个会返回一个形如 "[object XXX]" 的字符串,结果如下:
此处即完美解决了js中各种数据类型的类型判断,显示出的结果也都相对精确。
- 点赞
- 收藏
- 关注作者
评论(0)