JavaScript中判斷數(shù)據(jù)類型的方法總結(jié)
typeof
typeof用的比較多的時候,是判斷某個全局變量在不在,假如某個頁面定義了一個全局變量。假如你做如下判斷:
//haorooms是全局變量 if(haorooms!=undefined){ }//js會報錯,說"Uncaught ReferenceError: haorooms is not defined"
解決的方法是我們?nèi)缦聦懀?/p>
if(typeof haorooms!=undefined){ }
用了typeof之后,就不會報錯了!這是typeof的應(yīng)用之一!
此外,typeof還可以進行數(shù)據(jù)類型的判斷!如下:
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ù)類型還可以判斷function類型
很明顯,對于typeof,除了前四個類型外,null、對象、數(shù)組返回的都是object類型;
instanceof
可以用其判斷是否是數(shù)組。
var haorooms=[]; console.log(haorooms instanceof Array) //返回true
constructor
constructor就是返回對象相對應(yīng)的構(gòu)造函數(shù)。
判斷各種數(shù)據(jù)類型的方法:
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;}
通過輸出haorooms.constructor,可以看出constructor就是返回對象相對應(yīng)的構(gòu)造函數(shù)。
Object.prototype.toString
前面我們提到了可以運用 constructor 屬性來判定物件類型,讓我們再來講講 Object.protype.toString 這個方法
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]"
運用這種方式我們可以正確的判斷一個變量的基本型態(tài),但是如果是自訂類型的話,卻無法得知真正的類型,因為結(jié)果依然會是 [object Object]
其他
jQuery 也有類型判斷的方法,下面是一例
$.isWindow(window) // true
怎么做的呢
core.js#479 isWindow: function( obj ) { return obj != null && obj == obj.window; }
所以開一個這樣的 Object:
var fakeWindow; fakeWindow = {}; fakeWindow.window = fakeWindow; $.isWindow(fakeWindow) // true
你就騙過他了。
小結(jié)
在 JavaScript 中要正確判斷類型,當(dāng)仔細去鉆研的時候,真是一件麻煩事,根據(jù)不同的情境去設(shè)計你的判斷式是相當(dāng)重要的,我們也必須要去思考如何用最簡潔的方式判斷正確的類型,當(dāng)然這篇還有很多地方?jīng)]有介紹到,例如 isPrototypeOf 這個方法,JavaScript 是一個有許多歷史包袱的語言,但也是不斷的在進步,運用它的時候,要注意,有太多的方式是雙面刃,切記要小心運用。
相關(guān)文章
Bootstrap中的fileinput 多圖片上傳及編輯功能
這篇文章主要介紹了Bootstrap中的fileinput 多圖片上傳及編輯功能的實現(xiàn),非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-09-09關(guān)于layui導(dǎo)航欄不展示下拉列表的解決方法
今天小編就為大家分享一篇關(guān)于layui導(dǎo)航欄不展示下拉列表的解決方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09小程序?qū)崿F(xiàn)自定義導(dǎo)航欄適配完美版
這篇文章主要介紹了小程序?qū)崿F(xiàn)自定義導(dǎo)航欄適配完美版,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04JavaScript 隱式類型轉(zhuǎn)換規(guī)則詳解
這篇文章主要為大家介紹了JavaScript 隱式類型轉(zhuǎn)換規(guī)則詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步早日升職加薪2023-05-05