快捷導(dǎo)航

JavaScript中判斷數(shù)據(jù)類(lèi)型的方法總結(jié)

更新時(shí)間：2016年05月24日 15:31:30 作者：Aaron

比如要判斷一個(gè)變量是否是數(shù)組類(lèi)型,PHP中有is_array()函數(shù)可以直接判斷,然而js中我們需要...-- well,下面我們就來(lái)詳細(xì)看一下JavaScript中判斷數(shù)據(jù)類(lèi)型的方法總結(jié)

typeof
typeof用的比較多的時(shí)候，是判斷某個(gè)全局變量在不在，假如某個(gè)頁(yè)面定義了一個(gè)全局變量。假如你做如下判斷：

//haorooms是全局變量
if(haorooms!=undefined){
}//js會(huì)報(bào)錯(cuò)，說(shuō)"Uncaught ReferenceError: haorooms is not defined"

解決的方法是我們?nèi)缦聦?xiě)：

 if(typeof haorooms!=undefined){
 }

用了typeof之后，就不會(huì)報(bào)錯(cuò)了！這是typeof的應(yīng)用之一!

此外，typeof還可以進(jìn)行數(shù)據(jù)類(lèi)型的判斷！如下：

var haorooms="string"; console.log(haorooms); //string
var haorooms=1; console.log(haorooms); //number
var haorooms=false; console.log(haorooms); //boolean
var haorooms; console.log(typeof haorooms); //undfined

var haorooms= null; console.log(typeof haorooms); //object
var haorooms = document; console.log(typeof haorooms); //object
var haorooms = []; console.log(haorooms); //object
var haorooms = function(){}; console.log(typeof haorooms) //function  除了可以判斷數(shù)據(jù)類(lèi)型還可以判斷function類(lèi)型

很明顯，對(duì)于typeof,除了前四個(gè)類(lèi)型外，null、對(duì)象、數(shù)組返回的都是object類(lèi)型；

instanceof
可以用其判斷是否是數(shù)組。

var haorooms=[];
console.log(haorooms instanceof Array) //返回true

constructor
constructor就是返回對(duì)象相對(duì)應(yīng)的構(gòu)造函數(shù)。
判斷各種數(shù)據(jù)類(lèi)型的方法：

console.log([].constructor == Array);
console.log({}.constructor == Object);
console.log("string".constructor == String);
console.log((123).constructor == Number);
console.log(true.constructor == Boolean);

function employee(name,job,born){
  this.name=name;
  this.job=job;
  this.born=born; }

var haorooms=new employee("Bill Gates","Engineer",1985); 
console.log(haorooms.constructor); //輸出function employee(name, jobtitle, born){this.name = name; this.jobtitle = job; this.born = born;}

通過(guò)輸出haorooms.constructor，可以看出constructor就是返回對(duì)象相對(duì)應(yīng)的構(gòu)造函數(shù)。

Object.prototype.toString
前面我們提到了可以運(yùn)用 constructor 屬性來(lái)判定物件類(lèi)型，讓我們?cè)賮?lái)講講 Object.protype.toString 這個(gè)方法

Object.prototype.toString.apply({}) // "[object Object]"
Object.prototype.toString.apply([]) // "[object Array]"
Object.prototype.toString.apply(NaN)// "[object Number]"
Object.prototype.toString.apply(function(){}) // "[object Function]"

運(yùn)用這種方式我們可以正確的判斷一個(gè)變量的基本型態(tài)，但是如果是自訂類(lèi)型的話(huà)，卻無(wú)法得知真正的類(lèi)型，因?yàn)榻Y(jié)果依然會(huì)是 [object Object]

其他
jQuery 也有類(lèi)型判斷的方法，下面是一例

$.isWindow(window) // true

怎么做的呢

core.js#479
isWindow: function( obj ) {
  return obj != null && obj == obj.window;
}

所以開(kāi)一個(gè)這樣的 Object:

var fakeWindow;
fakeWindow = {};
fakeWindow.window = fakeWindow;
$.isWindow(fakeWindow) // true

你就騙過(guò)他了。

小結(jié)
在 JavaScript 中要正確判斷類(lèi)型，當(dāng)仔細(xì)去鉆研的時(shí)候，真是一件麻煩事，根據(jù)不同的情境去設(shè)計(jì)你的判斷式是相當(dāng)重要的，我們也必須要去思考如何用最簡(jiǎn)潔的方式判斷正確的類(lèi)型，當(dāng)然這篇還有很多地方?jīng)]有介紹到，例如 isPrototypeOf 這個(gè)方法，JavaScript 是一個(gè)有許多歷史包袱的語(yǔ)言，但也是不斷的在進(jìn)步，運(yùn)用它的時(shí)候，要注意，有太多的方式是雙面刃，切記要小心運(yùn)用。

您可能感興趣的文章: