JavaScript 數(shù)據(jù)類型檢測終極解決方案

JavaScript 的數(shù)據(jù)類型檢測是我們平時開發(fā)中經(jīng)常會遇到的場景伤疙,小到基本數(shù)據(jù)類型大至各種引用數(shù)據(jù)類型的檢測乐导,都是我們需要掌握的知識點肯骇。本章會詳細講解 JavaScript 中各種不同數(shù)據(jù)類型的檢測方法以及最后會實現(xiàn)一個數(shù)據(jù)類型檢測的終極方法。

紅寶石書告訴我們碟案,JavaScript 中的數(shù)據(jù)類型有Undefined愿险、Null、Boolean价说、Number辆亏、String、Object鳖目,其中前五種是基本類型扮叨,而 Object 是引用類型。實際上领迈,Object 中還包含了其它更為具體的引用類型彻磁,如Array、Function狸捅、Date衷蜓、RegExp、Error尘喝、Arguments等磁浇。

在本章的敘述中,我都會以上述 12 種數(shù)據(jù)類型為基礎來說明不同的檢測方式(實際上 JavaScript 中數(shù)據(jù)類型不止 12 種瞧省,其它數(shù)據(jù)類型我們鮮少碰到扯夭,所以在此就不多做贅述啦)鳍贾。

我們通常用來檢測數(shù)據(jù)類型的方法鞍匾,分別是typeofObject.prototype.toString,讓我們仔細來看看這兩個方法骑科。

typeof

MDN 中的敘述是橡淑,typeof 操作符返回一個字符串,表示未經(jīng)計算的操作數(shù)的類型咆爽。

其使用方式是 typeof operand 或 typeof(operand)梁棠,operand?是一個表達式置森,表示對象或原始值,其類型將被返回符糊,返回值是表示其數(shù)據(jù)類型的字符串的小寫形式凫海。

那么讓我們直接來看一下上述的 12 種數(shù)據(jù)類型使用 typeof 來檢測后返回值分別是什么:

var und=undefined;var nul=null;var boo=true;var num=1;var str='xys'var obj=new Object();var arr=[1,2,3];var fun=function(){}var date=new Date();var reg = /a/g;var err=new Error()var arg;(functiongetArg(){? ? arg=arguments;})();console.log(typeof und);? // undefinedconsole.log(typeof nul);? // objectconsole.log(typeof boo);? // booleanconsole.log(typeof num);? // numberconsole.log(typeof str);? // stringconsole.log(typeof obj);? // objectconsole.log(typeof arr);? // objectconsole.log(typeof fun);? //functionconsole.log(typeof date);? // objectconsole.log(typeof reg);? // objectconsole.log(typeof err);? // objectconsole.log(typeof arg);? // object復制代碼

可以看到,使用 typeof 方法來檢測數(shù)據(jù)類型男娄,基本類型大部分都能被準確檢測并返回正確的字符串(除了 Null 類型行贪,其返回 object 字符串),而引用類型大部分都不能夠被準確檢測(除了 Function 類型能夠準確返回 function 字符串外模闲,其它的都返回了 object 字符串)建瘫。

由此可得,typeof 方法并不能夠完全精準地檢測出上述 JavaScript 中的 12 中數(shù)據(jù)類型尸折。

Object.prototype.toString

ES5 規(guī)范中是這么描述 Object.prototype.toString 的:


可以知道啰脚,Object.prototype.toString 最終會返回形式如 [object,class] 的字符串,class 指代的是其檢測出的數(shù)據(jù)類型实夹,這個是我們判斷數(shù)據(jù)類型的關鍵橄浓。

同樣的,讓我們來看下使用 Object.prototype.toString 來檢測上述列舉到的 12 種數(shù)據(jù)類型都會返回什么樣的結(jié)果:

var toString=Object.prototype.toString;console.log(toString.call(und));? // [object Undefined]console.log(toString.call(nul));? // [object Null]console.log(toString.call(boo));? // [object Boolean]console.log(toString.call(num));? // [object Number]console.log(toString.call(str));? // [object String]console.log(toString.call(obj));? // [object Object]console.log(toString.call(arr));? // [object Array]console.log(toString.call(fun));? // [object Function]console.log(toString.call(date));? // [object Date]console.log(toString.call(reg));? // [object RegExp]console.log(toString.call(err));? // [object Error]console.log(toString.call(arg));? // [object Arguments]復制代碼

可以看到亮航,Object.prototype.toString 返回的 [object,class] 字符串中贮配,class 準確的表示了各個數(shù)據(jù)的類型,與 typeof 不同的是塞赂,class 所代表的數(shù)據(jù)類型字符串首字母是大寫的泪勒,而不像 typeof 返回的是小寫字符串。

數(shù)據(jù)類型檢測終極方法

通過上述對兩個檢測數(shù)據(jù)類型方法的介紹宴猾,我們知道 typeof 能夠被用來檢測除 Null 類型外的其它基本類型圆存,并且能夠檢測出引用類型中 Function 數(shù)據(jù)類型,而 Object.prototype.toString 能夠檢測出所有的數(shù)據(jù)類型仇哆,所以我們可以結(jié)合這兩個方法來實現(xiàn)一個 JavaScript 數(shù)據(jù)類型檢測的終極方法沦辙。

/** * @desc 數(shù)據(jù)類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{String} 類型字符串 */functiontype(obj) {? ? var toString=Object.prototype.toString;? ? var toType = {};? ? vartypeArr=['Undefined','Null','Boolean','Number','String','Object','Array','Function','Date','RegExp','Error','Arguments']typeArr.map(function(item, index) {? ? ? ? toType["[object "+ item +"]"] = item.toLowerCase();? ? })returntypeof obj !=="object"? typeof obj : toType[toString.call(obj)];}復制代碼

數(shù)據(jù)類型的單獨檢測

有時我們希望直接判斷一個數(shù)據(jù)是否是某個類型,那么我們可以單獨實現(xiàn)這些判斷某個數(shù)據(jù)類型的函數(shù)讹剔,這里直接給出各個函數(shù)的實現(xiàn)代碼油讯,需要的童鞋可以直接使用。

/** * @desc 是否是 Undefined 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisUndefined(obj) {returnobj === void 0;}/** * @desc 是否是 Null 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisNull(obj) {returnobj === null;}/** * @desc 是否是 Boolean 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisBoolean(obj) {returntypeof(obj) ==='boolean';}/** * @desc 是否是 Number 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisNumber(obj) {returntypeof(obj) ==='number';}/** * @desc 是否是 String 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisString(obj) {returntypeof(obj) ==='string';}/** * @desc 是否是 Object 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisObject(obj) {returnObject.prototype.toString.call(obj) ==='[object Object]';}/** * @desc 是否是 Array 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisArray(obj){returnArray.isArray?Array.isArray(obj):Object.prototype.toString.call(obj) ==='[object Array]';}/** * @desc 是否是 Function 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisFunction(obj){returntypeof(obj) ==='function';}/** * @desc 是否是 Date 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisDate(obj){returnObject.prototype.toString.call(obj) ==='[object Date]';}/** * @desc 是否是 RegExp 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisRegExp(obj){returnObject.prototype.toString.call(obj) ==='[object RegExp]';}/** * @desc 是否是 Error 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisError(obj){returnObject.prototype.toString.call(obj) ==='[object Error]';}/** * @desc 是否是 Arguments 類型檢測 * @param obj 待檢測的數(shù)據(jù) * @return{Boolean} 布爾值 */functionisArguments(obj){returnObject.prototype.toString.call(obj) ==='[object Arguments]';}

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末延欠,一起剝皮案震驚了整個濱河市陌兑,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌由捎,老刑警劉巖兔综,帶你破解...
    沈念sama閱讀 211,376評論 6 491
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡软驰,警方通過查閱死者的電腦和手機涧窒,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,126評論 2 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來锭亏,“玉大人纠吴,你說我怎么就攤上這事』哿觯” “怎么了呜象?”我有些...
    開封第一講書人閱讀 156,966評論 0 347
  • 文/不壞的土叔 我叫張陵,是天一觀的道長碑隆。 經(jīng)常有香客問我恭陡,道長,這世上最難降的妖魔是什么上煤? 我笑而不...
    開封第一講書人閱讀 56,432評論 1 283
  • 正文 為了忘掉前任休玩,我火速辦了婚禮,結(jié)果婚禮上劫狠,老公的妹妹穿的比我還像新娘拴疤。我一直安慰自己,他們只是感情好独泞,可當我...
    茶點故事閱讀 65,519評論 6 385
  • 文/花漫 我一把揭開白布呐矾。 她就那樣靜靜地躺著,像睡著了一般懦砂。 火紅的嫁衣襯著肌膚如雪蜒犯。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,792評論 1 290
  • 那天荞膘,我揣著相機與錄音罚随,去河邊找鬼。 笑死羽资,一個胖子當著我的面吹牛淘菩,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播屠升,決...
    沈念sama閱讀 38,933評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼潮改,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了腹暖?” 一聲冷哼從身側(cè)響起汇在,我...
    開封第一講書人閱讀 37,701評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎微服,沒想到半個月后趾疚,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,143評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡以蕴,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,488評論 2 327
  • 正文 我和宋清朗相戀三年糙麦,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片丛肮。...
    茶點故事閱讀 38,626評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡赡磅,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出宝与,到底是詐尸還是另有隱情焚廊,我是刑警寧澤,帶...
    沈念sama閱讀 34,292評論 4 329
  • 正文 年R本政府宣布习劫,位于F島的核電站咆瘟,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏诽里。R本人自食惡果不足惜袒餐,卻給世界環(huán)境...
    茶點故事閱讀 39,896評論 3 313
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望谤狡。 院中可真熱鬧灸眼,春花似錦、人聲如沸墓懂。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,742評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽捕仔。三九已至匕积,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間榜跌,已是汗流浹背闸天。 一陣腳步聲響...
    開封第一講書人閱讀 31,977評論 1 265
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留斜做,地道東北人苞氮。 一個月前我還...
    沈念sama閱讀 46,324評論 2 360
  • 正文 我出身青樓,卻偏偏與公主長得像瓤逼,于是被迫代替她去往敵國和親笼吟。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 43,494評論 2 348

推薦閱讀更多精彩內(nèi)容