十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
小编给大家分享一下javascript中类型判断的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!
河东网站制作公司哪家好,找创新互联!从网页设计、网站建设、微信开发、APP开发、成都响应式网站建设公司等网站项目制作,到程序开发,运营维护。创新互联自2013年创立以来到现在10年的时间,我们拥有了丰富的建站经验和运维经验,来保证我们的工作的顺利进行。专注于网站建设就选创新互联。
Javascript中数据类型分为两种:
简单数据类型:Undefined, NULL, Boolean, Number, String
复杂数据类型:Object
接下来我们就来看看怎么做数据类型判别吧?
首先来看看 typeof
Type | Result |
---|---|
Undefined | "undefined" |
Null | "object" (see below) |
Boolean | "boolean" |
Number | "number" |
String | "string" |
Symbol (new in ECMAScript 2015) | "symbol" |
Host object (provided by the JS environment) | Implementation-dependent |
Function object (implements [[Call]] in ECMA-262 terms) | "function" |
Any other object | "object" |
来点code demo吧
let a = undefined; typeof a "undefined" let b = false; typeof b "boolean" let c = 12; typeof c "number" let d = '12'; typeof d "string" let f = function () {}; typeof f "function"
接下来我们就来看看那些奇怪的现象吧
let str = new String('abc'); typeof str "object" let num = new Number(12); typeof num "object" var func = new Function(); typeof func; "function" typeof null "object"
使用构造函数创建的变量,使用typeof判断会返回“object”结果,但是Function函数例外,由它创建的变量typeof返回的是“function”
接着就来说说typeof null == "object"。这个相信前端开发的小伙伴都知道是这个结果了,But why? 这其实是javascript第一个版本就存在的一个bug,历史原因可以看看这篇文章The history of typeof null
关于如何判断数组
let arr = [1, 2, 3]; typeof arr "object"
上面这个结果大家应该不陌生,那该如何正确判断数组类型呢
1、instanceof
arr instanceof Array //true
2、isArray
Array.isArray(arr) // true
3、constructor.name
arr.constructor.name // "Array"
第三种用法用的人应该比较少,不少前端的的小伙伴都没用过。对于复杂类型Object,它的每个实例都有constructor属性。
instanceof vs isArray
当检测Array实例时, Array.isArray 优于 instanceof,因为Array.isArray能检测iframes.
var iframe = document.createElement('iframe'); document.body.appendChild(iframe); xArray = window.frames[window.frames.length-1].Array; var arr = new xArray(1,2,3); // [1,2,3] // Correctly checking for Array Array.isArray(arr); // true // Considered harmful, because doesn't work though iframes arr instanceof Array; // false
这段代码是从MDN copy的。补充以下结果,发现第三种方法constructor.name也能正确判断出。
arr.constructor.name //"Array"
关于NaN
使用isNaN判断NaN。
isNaN(1/'a') // true
我们知道NaN == NaN结果是false,那如何判断两个NaN变量呢?
比较两个NaN变量,使用es6的Object.is()即可。
let nan1 = NaN let nan2 = NaN Object.is(nan1, nan2) true
以上是“javascript中类型判断的示例分析”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!