摘要:最常見(jiàn)的判斷方法它的官方解釋操作符返回一個(gè)字符串,表示未經(jīng)計(jì)算的操作數(shù)的類(lèi)型。另外,是判斷對(duì)象是否屬于某一類(lèi)型,而不是獲取的對(duì)象的類(lèi)型。多個(gè)窗口意味著多個(gè)全局環(huán)境,不同的全局環(huán)境擁有不同的全局對(duì)象,從而擁有不同的內(nèi)置類(lèi)型構(gòu)造函數(shù)。
js中的數(shù)據(jù)類(lèi)型
js中只有六種原始數(shù)據(jù)類(lèi)型和一個(gè)Object:
Boolean
Null
Undefined
Number
String
Symbol (ECMAScript 6 新定義)
Object
大家認(rèn)真記清這個(gè)描述,不要到時(shí)候把Array、Date都當(dāng)成js的數(shù)據(jù)類(lèi)型就尷尬了。那可能會(huì)有人問(wèn),那Array和Date算什么呢,他們都屬于Object,看下面分類(lèi):
Object分類(lèi)Object分為本地對(duì)象、內(nèi)置對(duì)象和宿主對(duì)象三種本地對(duì)象
定義:獨(dú)立于宿主環(huán)境的ECMAScript實(shí)現(xiàn)提供的對(duì)象。簡(jiǎn)單的說(shuō)就是ECMA定義的類(lèi)。他們包括:
Object Function Array String Boolean Number Date RegExp Error EvalError RangeError ReferenceError SyntaxError TypeError URIError
所以Array和Date都屬于對(duì)象類(lèi)型,它們是本地對(duì)象。
疑問(wèn):1.有人可能會(huì)問(wèn),為什么String也是Object類(lèi)型,上面不是說(shuō)了是原始類(lèi)型嗎?
答:原始類(lèi)型中有字符串String不錯(cuò),它只是表達(dá)了一種數(shù)據(jù)類(lèi)型,但數(shù)據(jù)類(lèi)型也有自己的類(lèi)定義啊,是吧,上面的String說(shuō)的就是它的類(lèi)型定義,是個(gè)對(duì)象,所以當(dāng)然也是引用類(lèi)型了。其他同理。
看下面demo
var str1="hello"; var str2=new String("hello"); typeof str1 //string typeof str2 //object //如果想獲取str2的字符串,可以通過(guò)str2.toString() str1 instanceof String //false str2 instanceof String //true內(nèi)置對(duì)象
定義:“由ECMAScript實(shí)現(xiàn)提供的、獨(dú)立于宿主環(huán)境的所有對(duì)象,在ECMAScript程序開(kāi)始執(zhí)行時(shí)出現(xiàn)”。這意味著開(kāi)發(fā)者不必明確實(shí)例化內(nèi)置對(duì)象,它已經(jīng)被實(shí)例化了。宿主對(duì)象
內(nèi)置對(duì)象只有兩個(gè)Global和Math,他們其實(shí)也是本地對(duì)象,根據(jù)定義每個(gè)內(nèi)置對(duì)象都是本地對(duì)象。
所有非本地對(duì)象都是宿主對(duì)象,即由ECMAScript實(shí)現(xiàn)的宿主環(huán)境提供的對(duì)象。所有BOM和DOM對(duì)象都是宿主對(duì)象。typeof
最常見(jiàn)的判斷方法:typeof,它的官方解釋?zhuān)?/p>
typeof操作符返回一個(gè)字符串,表示未經(jīng)計(jì)算的操作數(shù)的類(lèi)型。
簡(jiǎn)單理解就是typeof是判斷的是原始類(lèi)型(值類(lèi)型),但函數(shù)返回的是function,null返回的也是object
typeof Undefined //"undefined" var num; typeof num //undefinedtypeof各類(lèi)型返回結(jié)果列表
類(lèi)型 | 結(jié)果 |
---|---|
Undefined | "undefined" |
Null | "object" |
Boolean | "boolean" |
Number | "number" |
String | "string" |
Symbol (ECMAScript 6 新增) | "symbol" |
宿主對(duì)象(由JS環(huán)境提供) | Implementation-dependent |
函數(shù)對(duì)象([[Call]] 在ECMA-262條款中實(shí)現(xiàn)了) | "function" |
任何其他對(duì)象 | "object" |
在 JavaScript 最初的實(shí)現(xiàn)中,JavaScript 中的值是由一個(gè)表示類(lèi)型的標(biāo)簽和實(shí)際數(shù)據(jù)值表示的。對(duì)象的類(lèi)型標(biāo)簽是 0。由于 null 代表的是空指針(大多數(shù)平臺(tái)下值為 0x00),因此,null的類(lèi)型標(biāo)簽也成為了 0,typeof null就錯(cuò)誤的返回了"object"。typeof優(yōu)缺點(diǎn)列表
優(yōu)點(diǎn) | 缺點(diǎn) |
---|---|
判斷原始類(lèi)型比較方便 | null返回的是object |
方法返回的是function | |
所有的引用類(lèi)型都返回object,Array、Date等不能準(zhǔn)確定位 |
定義:“instanceof 運(yùn)算符用來(lái)測(cè)試一個(gè)對(duì)象(第一個(gè)參數(shù))在其原型鏈中是否存在一個(gè)構(gòu)造函數(shù)(第二個(gè)參數(shù))的 prototype 屬性。”
簡(jiǎn)單理解就是:instanceof是判斷兩個(gè)對(duì)象“最近”prototype是否一樣。
另外,instanceof是判斷對(duì)象是否屬于某一類(lèi)型,而不是獲取的對(duì)象的類(lèi)型。
var str1="hello"; var str2=new String("hello"); var arr=[1,2,3]; function person(){} function man(){} man.prototype=new person(); var m1=new person(); var m2=new man(); str1 instanceof String //false str2 instanceof String //true arr instanceof Array //true arr instanceof window.frames[0].Array //false m1 instanceof person //true m2 instanceof man //true m2 intanceof person //true優(yōu)缺點(diǎn)列表
優(yōu)點(diǎn) | 缺點(diǎn) |
---|---|
判斷對(duì)象的具體類(lèi)型 | 只能判斷對(duì)象,對(duì)原始類(lèi)型不能判斷 |
多全局對(duì)象時(shí)返回不正確 |
簡(jiǎn)單來(lái)說(shuō):多全局對(duì)象就是跨窗口或跨frame操作。全局環(huán)境
在瀏覽器中,我們的腳本可能需要在多個(gè)窗口之間進(jìn)行交互。多個(gè)窗口意味著多個(gè)全局環(huán)境,不同的全局環(huán)境擁有不同的全局對(duì)象,從而擁有不同的內(nèi)置類(lèi)型構(gòu)造函數(shù)。
這可能會(huì)引發(fā)一些問(wèn)題。
比如,表達(dá)式 [] instanceof window.frames[0].Array 會(huì)返回false,因?yàn)?Array.prototype !== window.frames[0].Array.prototype,因此你必須使用 Array.isArray(myObj) 或者 Object.prototype.toString.call(myObj) === "[object Array]"來(lái)判斷myObj是否是數(shù)組。
alert(c.constructor === Array) ----------> true alert(d.constructor === Date) -----------> true alert(e.constructor === Function) -------> true 注意: constructor 在類(lèi)繼承時(shí)會(huì)出錯(cuò) eg: function A(){}; function B(){}; A.prototype = new B(); //A繼承自B var aObj = new A(); alert(aobj.constructor === B) -----------> true; alert(aobj.constructor === A) -----------> false; 而instanceof方法不會(huì)出現(xiàn)該問(wèn)題,對(duì)象直接繼承和間接繼承的都會(huì)報(bào)true: alert(aobj instanceof B) ----------------> true; alert(aobj instanceof B) ----------------> true; 言歸正傳,解決construtor的問(wèn)題通常是讓對(duì)象的constructor手動(dòng)指向自己: aobj.constructor = A; //將自己的類(lèi)賦值給對(duì)象的constructor屬性 alert(aobj.constructor === A) -----------> true; alert(aobj.constructor === B) -----------> false; //基類(lèi)不會(huì)報(bào)true了;
缺點(diǎn):繼承的對(duì)象判斷時(shí),不準(zhǔn)確。感覺(jué)雞肋。
最靠譜的方法: Object.prototype.toString.call(obj)
這種方法不存在多全局環(huán)境和Array、null返回object的情況,
原始類(lèi)型和原始類(lèi)型對(duì)應(yīng)的引用類(lèi)型聲明的變量都能返回正確的值
但是這個(gè)方法對(duì)自定義類(lèi)型無(wú)效,自定義類(lèi)型返回的都是Object,所以自定義時(shí)還是使用instanceof。
var str1="hello"; var str2=new String("hello"); var arr=[1,2,3]; function Man(){} var man=new Man(); Object.prototype.toString.call(str1); //[object String] Object.prototype.toString.call(str2); //[object String] Object.prototype.toString.call(arr); //[object Array] Object.prototype.toString.call(man); //[object Object] Object.prototype.toString.call(null); //[object Null] Object.prototype.toString.call(/test/) //[object RegExp]
優(yōu)點(diǎn) | 缺點(diǎn) |
---|---|
不存在多全局環(huán)境問(wèn)題 | 只能判斷本地對(duì)象和宿主對(duì)象 |
原始類(lèi)型無(wú)論是字面量語(yǔ)法聲明還是通過(guò)對(duì)應(yīng)的引用類(lèi)型聲明都能正確判斷 | 自定義類(lèi)型都返回[object Object] |
就是對(duì)prototype的封裝。源碼附上:
type: function( obj ) { return obj == null ? String( obj ) : class2type[ toString.call(obj) ] || "object"; },對(duì)數(shù)組的判斷
var arr=[1,2,3]; typeof arr //object 分辨不出類(lèi)型 arr instanceof Array //true //受多全局環(huán)境影響 Object.prototype.toString.call(arr); //[object Array] //推薦 Array.isArray(arr) //true //推薦 $.type(arr) //array //推薦
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/94351.html
摘要:并總結(jié)經(jīng)典面試題集各種算法和插件前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快速搭建項(xiàng)目。 本文是關(guān)注微信小程序的開(kāi)發(fā)和面試問(wèn)題,由基礎(chǔ)到困難循序漸進(jìn),適合面試和開(kāi)發(fā)小程序。并總結(jié)vue React html css js 經(jīng)典面試題 集各種算法和插件、前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快...
摘要:并總結(jié)經(jīng)典面試題集各種算法和插件前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快速搭建項(xiàng)目。 本文是關(guān)注微信小程序的開(kāi)發(fā)和面試問(wèn)題,由基礎(chǔ)到困難循序漸進(jìn),適合面試和開(kāi)發(fā)小程序。并總結(jié)vue React html css js 經(jīng)典面試題 集各種算法和插件、前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快...
摘要:并總結(jié)經(jīng)典面試題集各種算法和插件前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快速搭建項(xiàng)目。 本文是關(guān)注微信小程序的開(kāi)發(fā)和面試問(wèn)題,由基礎(chǔ)到困難循序漸進(jìn),適合面試和開(kāi)發(fā)小程序。并總結(jié)vue React html css js 經(jīng)典面試題 集各種算法和插件、前端視頻源碼資源于一身的文檔,優(yōu)化項(xiàng)目,在瀏覽器端的層面上提升速度,幫助初中級(jí)前端工程師快...
閱讀 4716·2021-09-09 09:33
閱讀 2441·2019-08-29 17:15
閱讀 2430·2019-08-29 16:21
閱讀 1040·2019-08-29 15:06
閱讀 2682·2019-08-29 13:25
閱讀 636·2019-08-29 11:32
閱讀 3306·2019-08-26 11:55
閱讀 2649·2019-08-23 18:24