前言

類型判斷是我們?cè)谌粘９ぷ髦薪?jīng)常會(huì)遇到的一個(gè)功能，本文將給大家詳細(xì)介紹關(guān)于javascript類型判斷的相關(guān)內(nèi)容，下面話不多說(shuō)了，來(lái)一起看看詳細(xì)的介紹吧

Javascript中數(shù)據(jù)類型分為兩種：

• 簡(jiǎn)單數(shù)據(jù)類型：Undefined, NULL, Boolean, Number, String
• 復(fù)雜數(shù)據(jù)類型：Object

接下來(lái)我們就來(lái)看看怎么做數(shù)據(jù)類型判別吧？

首先來(lái)看看 typeof

來(lái)點(diǎn)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"

接下來(lái)我們就來(lái)看看那些奇怪的現(xiàn)象吧

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"

使用構(gòu)造函數(shù)創(chuàng)建的變量，使用typeof判斷會(huì)返回“object”結(jié)果，但是Function函數(shù)例外，由它創(chuàng)建的變量typeof返回的是“function”

接著就來(lái)說(shuō)說(shuō)typeof null == "object"。這個(gè)相信前端開(kāi)發(fā)的小伙伴都知道是這個(gè)結(jié)果了，But why? 這其實(shí)是javascript第一個(gè)版本就存在的一個(gè)bug,歷史原因可以看看這篇文章The history of typeof null

關(guān)于如何判斷數(shù)組

let arr = [1, 2, 3];
typeof arr
"object"

上面這個(gè)結(jié)果大家應(yīng)該不陌生，那該如何正確判斷數(shù)組類型呢

1、instanceof

arr instanceof Array //true

2、isArray

Array.isArray(arr) // true

3、constructor.name

arr.constructor.name // "Array"

第三種用法用的人應(yīng)該比較少，不少前端的的小伙伴都沒(méi)用過(guò)。對(duì)于復(fù)雜類型Object,它的每個(gè)實(shí)例都有constructor屬性。

instanceof vs isArray

當(dāng)檢測(cè)Array實(shí)例時(shí), Array.isArray 優(yōu)于 instanceof,因?yàn)锳rray.isArray能檢測(cè)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的。補(bǔ)充以下結(jié)果，發(fā)現(xiàn)第三種方法constructor.name也能正確判斷出。

arr.constructor.name //"Array"

關(guān)于NaN

使用isNaN判斷NaN。

isNaN(1/'a') // true

我們知道NaN == NaN結(jié)果是false,那如何判斷兩個(gè)NaN變量呢？

比較兩個(gè)NaN變量，使用es6的Object.is()即可。

let nan1 = NaN
let nan2 = NaN
Object.is(nan1, nan2)
true

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，如果有疑問(wèn)大家可以留言交流，謝謝大家對(duì)腳本之家的支持。