js 如何判斷數(shù)據(jù)類型

本文除了介紹如何檢測數(shù)據(jù)類型,順帶也將數(shù)據(jù)類型也大概介紹了下
參考《JavaSript高級程序設(shè)計》、MDN網(wǎng)站等

方法總結(jié)為下面幾類

  1. typeof
  2. instanceof
  3. jquery
  4. Object.toString.call(obj)
  5. constructor
1. typeof
語法

typeof operand 或者 typeof (operand)

類型說明
數(shù)據(jù)類型 typeof 輸出結(jié)果 說明
undefined "undefined" 未初始化和未聲明的變量
null "object" 只有null這個值才是這種類型;
\color{red}{注}:undefined值派生自null, undefined == null返回true,undefined === null返回false, 但不能通用這兩個變量,null為了變現(xiàn)變量是空對象,undefined為了體現(xiàn)變量為初始化或者未聲明
boolean "boolean" 只有true、false;
\color{red}{注}:區(qū)分大小寫,True, False這些都不是
Boolean()函數(shù)可以將其他變量轉(zhuǎn)換成為boolean變量, 關(guān)于轉(zhuǎn)換方式,可見附錄 1. Boolean([value])函數(shù) 轉(zhuǎn)換
Number "number" a.??如果浮點數(shù)值小數(shù)點后沒有跟任何數(shù)字的話,會被轉(zhuǎn)換成整型來保存;

b.?? 浮點數(shù)值最高精度是17位,在js中0.1+0.2=0.30000000000000004,所以在比較的時候需要注意,使用if(0.1+0.2 == 0.3){}else{}會進入到else分支;但有些計算又是正確的,例如0.15+0.05==0.2返回true,最好還是不要使用浮點數(shù)去進行比較計算

c.?? 內(nèi)存限制,超過瀏覽器的計算范圍,都會被轉(zhuǎn)換為 Infinity、-Infinity(正負無窮),并且不能再進行計算(Infinity - Infinity返回結(jié)果是NaN);可以通過isFinte(value)函數(shù)判斷;Number.NEGATIVE_INFINITY、Number.POSITIVE_INFINITY分別代表負、正Infinity的值;

d.?? NaN(Not a number)
?????關(guān)于NaN的操作(例如NaN/10返回NaN);
?????NaN與任何值都不相等,NaN == NaN也返回false;
?????isNaN()用于檢測該類型,如果該值可以轉(zhuǎn)換為數(shù)值的話(包括Infinity-Infinity),則返回false,例如"10"Boolean值,其余不能被轉(zhuǎn)換成為數(shù)值的返回true;isNaN還可以檢測對象,首先調(diào)用valueOf()方法,如果沒有的話,再調(diào)用toString()方法

e.?? 數(shù)值轉(zhuǎn)換方法(具體轉(zhuǎn)換方法見附錄 2. Number數(shù)值轉(zhuǎn)換方法):
?????Number()
?????parseInt()
?????parseFloat()
String "string" '\u03a3'類似的字符長度只算1;
數(shù)值、布爾值、對象、字符串都自帶.toString()方法,nullundefined沒有;
num.toString(8)可以將數(shù)值轉(zhuǎn)換成8進制的字符顯示,其他進制類同;
String([value])可以將所有類型轉(zhuǎn)換成字符;
任意值+""可以轉(zhuǎn)換成為字符
Symbol "symbol" 關(guān)于Symbol-阮一峰
宿主對象(由JS環(huán)境提供) Implementation-dependent
函數(shù)對象 "function"
Object "object" 任何其他對象
2. instanceof

用于識別對象的問題

語法

object instanceof constructor
object: 要檢測的對象
constructor: 某個構(gòu)造函數(shù)

說明

instanceof運算符用來檢測constructor.prototype是否存在于參數(shù)object的原型鏈上
當typeof無法分辨是null還是object時,就可以用這個方法
可以參考這篇文章JavaScript instanceof 運算符深入剖析

以下是上述作者整理的instanceof運算符代碼

function instance_of(L, R) {
  var O = R.prototype;    // 取R的顯示原型
  L = L.__proto__;      // 取L的隱式原型
  while(true) {
    if(L === null) 
      return false;
    if(O === L) 
       return true;
    L = L.__proto__;
  }
}
舉例說明
var a = new String("123");
console.log(a instanceof String);         // true
3. jQuery中判斷的方法(基于jQuery3 .3.1)
判斷數(shù)組

jQuery.isArray(object)
實際調(diào)用Array.isArray(object)方法判斷

jQuery.isArray([1, 2, 3])     // true
jQuery.isArray('[1, 2, 3]')    // false,字符串
判斷函數(shù)

jQuery.isFunction(value)
實際調(diào)用typeof value === "function"

判斷數(shù)字

jQuery.isNumeric(value)
jQuery把數(shù)字和可以轉(zhuǎn)換成數(shù)字的字符串都判斷為數(shù)字

// jQuery源碼
jQuery.isNumeric = function(obj) {
  var type = jQuery.type(obj);    // 判斷數(shù)據(jù)類型
  return (type === "number" || type === "string") &&
    !isNaN(obj - parseFloat(obj));     // 排除Infinity和-Infinity,因為isNaN(Infinity)返回的是true
}
判斷空對象

jQuery.isEmptyObject(obj)
通過for in循環(huán)變量value判斷是否是空對象

for(name in obj) {
  return false;   // 不是空對象
}
return true;
判斷是否是純粹的對象

jQuery.isPlainObject(value)
其中只介紹源碼中其判斷是否為對象方法

 isPlainObject: function(obj) {
  ...
  if(!obj || toString.call(obj) !== "[object object]") {    // 用toString方法判斷其是否是object類型
    return false;
  }
  ...
} 
判斷類型

jQuery.type(obj)

toType(obj) {
  if ( obj == null ) {
    return obj + "";      // null 就返回null
  }

  return typeof obj === "object" || typeof obj === "function" ?
    class2type[ toString.call( obj ) ] || "object" :    // 通過{}.toString.call來判斷類型
    typeof obj;
 }

// class2type[ toString.call( obj ) 
class2type["object xx"] = xx.toLowerCase()     // xx為對應(yīng)類型(Boolean Number String Function Array Date RegExp Object Error Symbol)

其他
  1. {}.toString.call 返回[object xx](xx是對應(yīng)的數(shù)據(jù)類型,包括boolean Number String Function Array Date RegExp Object Error Symbol
  2. constructor根據(jù)對象的constructor判斷
var a = [1, 2, 3];
a.constructor === Array    // true
附錄
1. Boolean([value])函數(shù) 轉(zhuǎn)換

參考鏈接: MDN—Boolean() 網(wǎng)站

  • 返回false的情況
    省略該參數(shù)、0、-0、nullfalseNaN、undefined、空字符串,生成的Boolean對象的值是false,DOM對象document.all對象傳入也是false
  • 返回true的情況
    除上以外均為true,包括Boolean("false")(因為不是空字符串),Boolean({})、Boolean([])(因為任何對象都會被轉(zhuǎn)換成true,除非對象被置為null了)。

    \color{red}{注?。?!}
  • 推薦使用Boolean([value])而不是New Boolean([value]),原因如下
    typeof(new Boolean([value]))返回的是"object",
    typeof(Boolean([value])) 才是返回"boolean",
    New Boolean()除了nullfalse,在使用if(new Boolean([value]))直接進行判斷的時候都會被當成true來對待,Boolean()就不會有這個問題。
  • 那么如何正確使用new Boolean()
    通過valueOf()來獲取對應(yīng)的boolean值
      var a = New Boolean(''); 
      if(a.valueOf()) { 
         \\ ...
      } else {
         \\ ...
     }
    
2. Number數(shù)值轉(zhuǎn)換方法
  • Number()
    a.???Boolean值對應(yīng)轉(zhuǎn)換成為0,1;
    b.???數(shù)字傳入什么就返回什么(注:Number(0123)是個8進制數(shù)字)
    c.???null返回0
    d.???undefined返回NaN
    e.???字符串的話分情況:
    ??????e1. 如果是都是數(shù)字形式的字符串,則返回對應(yīng)的數(shù)字;例如Number("0123")返回123,會忽略前面的0。
    ??????e2. 如果是0x15這種帶有效的16進制格式的,則返回對應(yīng)的十進制數(shù)。
    ??????e3. 空字符串返回0
    ??????e4. 其余返回NaN
    f.???對象的話,先調(diào)用valueOf()如果返回NaN,再調(diào)用toString()方法
  • parseInt()
    a.???轉(zhuǎn)換字符串時,按遇到的第一個非空字符進行判斷。
    ??????a1. 第一個字符是數(shù)字字符的話,解析到最后一個非數(shù)字字符
    ??????a2. 如果遇到的不是數(shù)字或者負號,返回 NaN,反之則按照a1的數(shù)字轉(zhuǎn)換方式進行轉(zhuǎn)換,例如parseInt(" 123adfa123"),返回123;
    ??????a3. 空字符返回NaN
    ??????a4. 如果0x開頭,則會當成16進制來解析,0開頭則當成8進制來解析(ES5 parseInt(070)還是會被當成10進制,返回70
    b. ???parseInt(num, 進制),例如parseInt(0x15, 16)或者parseInt("AF", 16)都會被當成16進制進行解析;parseInt(aaa, 8)由于aaa不能被轉(zhuǎn)換成為8進制,所以返回NaN
  • parseFloat()
  1. ???數(shù)字型字符串的話,只能解析到第一個小數(shù)點,第二個小數(shù)點的話,作廢處理,例如parseFloat("11.11.23")返回11.11
  2. ???只會解析10進制,帶16進制"0x"標志的字符都會被轉(zhuǎn)換成為0,parseFloat("0x13")返回0,parseFloat("0x")也返回0;
  3. ???其余與parseInt()一樣


?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 第2章 基本語法 2.1 概述 基本句法和變量 語句 JavaScript程序的執(zhí)行單位為行(line),也就是一...
    悟名先生閱讀 4,504評論 0 13
  • 1.通過typeof可以判斷處幾種基本數(shù)據(jù)類型Boolean,number,string,null,undefin...
    舟漁行舟閱讀 686評論 0 1
  • 第3章 基本概念 3.1 語法 3.2 關(guān)鍵字和保留字 3.3 變量 3.4 數(shù)據(jù)類型 5種簡單數(shù)據(jù)類型:Unde...
    RickCole閱讀 5,489評論 0 21
  • 今天比較忙,把昨天說C6噴漆后杠 倒車雷達不好用 等晚上忙完了看到車才想起來!晚上又加班查原因 結(jié)果才發(fā)現(xiàn)跟噴漆沒...
    京心達白金閱讀 106評論 0 0
  • 相機里的畫面只是記錄,心里的定格才是懷念。----送給那些在路上的人 誰能告訴我春天來過得痕跡?是冬天...
    雲(yún)中客閱讀 351評論 0 1

友情鏈接更多精彩內(nèi)容