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

一、數(shù)據(jù)類型

js的數(shù)據(jù)類型分為兩類 基礎(chǔ)數(shù)據(jù)類型與引用數(shù)據(jù)類

  • 基礎(chǔ)數(shù)據(jù)類型 undefined、null、number、string、 boolean、symbol(es6新增 表示獨(dú)一無(wú)二的值)
  • 引用數(shù)據(jù)類型 Object、Function、 Array、Date、RegExp、Error、Number、String、Boolean

區(qū)別

  • 基礎(chǔ)數(shù)據(jù)類型的數(shù)據(jù)名、值都保存在棧內(nèi)存中


    icon.png
  • 引用數(shù)據(jù)類型的數(shù)據(jù) 名存儲(chǔ)在棧內(nèi)存中,值存儲(chǔ)在堆內(nèi)存中,但是棧內(nèi)存會(huì)提供一個(gè)引用的地址指向堆內(nèi)存中的值


    icon2.png

二、數(shù)據(jù)類型判斷

1、typeof()

判斷基本數(shù)據(jù)類型(也可用于引用類型的Function類型判斷)

console.log(typeof 123)    //number
console.log(typeof '123')   //string
console.log(typeof false)   //boolean
console.log(typeof undefined)   //undefined
console.log(typeof null)    //object 無(wú)效
console.log(typeof Symbol() ) //symbol
console.log(typeof {})      //object
console.log(typeof [])      //object 無(wú)效
console.log(typeof Function() ) //function

console.log(typeof new Date())   //object 無(wú)效
console.log(typeof new RegExp())  //object 無(wú)效
console.log(typeof new Number())  //object 無(wú)效
console.log(typeof new String())  //object 無(wú)效
console.log(typeof new Boolean())  //object 無(wú)效

typeof 可以檢測(cè)出 number、string、boolean、undefined、object、function 、symbol七種數(shù)據(jù)類型,對(duì)于Array、null、以及其他構(gòu)造器對(duì)象的類型檢測(cè)無(wú)效,原因是構(gòu)造器本質(zhì)都是object類型。特殊的是null的數(shù)據(jù)類型是object 是因?yàn)閚ull會(huì)被當(dāng)作一個(gè)空對(duì)象的引用

2、instanceof

判斷引用數(shù)據(jù)類型

console.log([] instanceof Array)  //true
console.log({} instanceof Object) //true
console.log(Function() instanceof Function) //true
console.log(new Date() instanceof Date) //true
console.log(new RegExp() instanceof RegExp) //true
console.log(new Number() instanceof Number) //true
console.log(null instanceof Null) //報(bào)錯(cuò)
console.log(undefined instanceof undefined) //報(bào)錯(cuò)
...

表達(dá)式:a instanceof b,用來(lái)判斷a是否是b的實(shí)例對(duì)象
其中 a是對(duì)象 b是函數(shù),通過(guò)判斷構(gòu)造函數(shù)b的原型對(duì)象 b.prototype是否在a實(shí)例對(duì)象的原型鏈上來(lái)確定實(shí)例對(duì)象的具體數(shù)據(jù)類型,但不能用來(lái)檢測(cè) null undefined

3、constructor

判斷引用數(shù)據(jù)類型
constructor 屬性返回對(duì)創(chuàng)建此對(duì)象的數(shù)組函數(shù)的引用,就是返回對(duì)象相對(duì)應(yīng)的構(gòu)造函數(shù)

console.log([].constructor)  //? Array() { [native code] }
console.log({}.constructor) //? Object() { [native code] }
console.log(Function().constructor) //? Function() { [native code] }
console.log(new Date().constructor) //? Date() { [native code] }
console.log(new RegExp().constructor) //? RegExp() { [native code] }
console.log(new Number().constructor) //? Number() { [native code] }
console.log(null.constructor) //報(bào)錯(cuò)
console.log(undefined.constructor) //報(bào)錯(cuò)

與instanceof定義差異
a instanceof b : 判斷a是否是構(gòu)造函數(shù)b的實(shí)例對(duì)象
a.constructor === b : 判斷a的構(gòu)造函數(shù) 是否是b
同時(shí)他也不能用于檢測(cè) null 與 undefined的數(shù)據(jù)類型

注:
使用instaceof和construcor,被判斷的array必須是在當(dāng)前頁(yè)面聲明的!比如,一個(gè)頁(yè)面(父頁(yè)面)有一個(gè)框架,框架中引用了一個(gè)頁(yè)面(子頁(yè)面),在子頁(yè)面中聲明了一個(gè)array,并將其賦值給父頁(yè)面的一個(gè)變量,這時(shí)判斷該變量,Array == object.constructor;會(huì)返回false;
原因:
1、array屬于引用型數(shù)據(jù),在傳遞過(guò)程中,僅僅是引用地址的傳遞。
2、每個(gè)頁(yè)面的Array原生對(duì)象所引用的地址是不一樣的,在子頁(yè)面聲明的array,所對(duì)應(yīng)的構(gòu)造函數(shù),是子頁(yè)面的Array對(duì)象;父頁(yè)面來(lái)進(jìn)行判斷,使用的Array并不等于子頁(yè)面的Array;切記 參考:http://www.cnblogs.com/leejersey/p/5191924.html

4、Object.prototype.toString.call()

可以用來(lái)判斷基礎(chǔ)數(shù)據(jù)類型和引用數(shù)據(jù)類型,提供了一個(gè)通用的數(shù)據(jù)類型判斷模式

Object.prototype.toString.call('') //[object String]
Object.prototype.toString.call(1) //[object Number]
Object.prototype.toString.call(true) //[object Boolean]
Object.prototype.toString.call(null) //[object Null]
Object.prototype.toString.call(undefined) //[object Undefined]
Object.prototype.toString.call({}) //[object Object]
Object.prototype.toString.call([]) //[object Array]
Object.prototype.toString.call(new Function()) //[object Function]
Object.prototype.toString.call(new Date()) //[object Date]
Object.prototype.toString.call(new RegExp()) //[object RegExp]
Object.prototype.toString.call(new Error()) //[object Error]
Object.prototype.toString.call(Math) //[object Math]
Object.prototype.toString.call(JSON) //[object JSON]
Object.prototype.toString.call(Symbol()) //[object Symbol]

注:通過(guò)Object.prototype.toString.call()來(lái)檢測(cè)對(duì)象類型的原理
toString()方法返回反映這個(gè)對(duì)象的字符串,那為什么不用obj.toString()直接檢測(cè)對(duì)象的類型呢?

console.log([1, 2].toString()) //1,2
console.log((123).toString())  //123
console.log('abc'.toString()) //abc
console.log(new Date().toString())  //Sat Aug 03 2019 17:29:54 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)
console.log(function(){}.toString()) //function(){}
console.log(/\d/.toString()) // /\d/
console.log(new Error().toString()) //Error

由上可以看出直接通過(guò)obj.toString()輸出與Object.prototype.toString.call(obj)的結(jié)果不一致。
這是因?yàn)閠oString為Object的原型方法,而Array 、Function等類型作為Object的實(shí)例,都重寫了toString方法。不同的對(duì)象類型調(diào)用toString方法時(shí),根據(jù)原型鏈的知識(shí),調(diào)用的是對(duì)應(yīng)的重寫之后的toString方法(Function類型返回內(nèi)容為函數(shù)體的字符串,Array類型返回元素組成的字符串.....),而不會(huì)去調(diào)用Object上原型toString方法(返回對(duì)象的具體類型),所以采用obj.toString()不能得到其對(duì)象類型,只能將obj轉(zhuǎn)換為字符串類型;因此,在想要得到對(duì)象的具體類型時(shí),應(yīng)該調(diào)用Object上原型toString方法
我們可以驗(yàn)證一下,將數(shù)組的toString方法刪除,看看會(huì)是什么結(jié)果?

var arr=[1,2,3];
console.log(Array.prototype.hasOwnProperty("toString"));//true
console.log(arr.toString());//1,2,3
delete Array.prototype.toString;//delete操作符可以刪除實(shí)例屬性
console.log(Array.prototype.hasOwnProperty("toString"));//false
console.log(arr.toString());//"[object Array]"

刪除了Array的toString方法后,同樣再采用arr.toString()方法調(diào)用時(shí),不再有屏蔽Object原型方法的實(shí)例方法,因此沿著原型鏈,arr最后調(diào)用了Object的toString方法,返回了和Object.prototype.toString.call(arr)相同的結(jié)果。
參考:https://www.cnblogs.com/youhong/p/6209054.html

三、思考

  • 區(qū)分Array 與Object的數(shù)據(jù)類型
function isArray(object){
    return object && typeof object==='object' && Array == object.constructor
}

function isArray(object){
    return object && typeof object==='object' && object instanceof Array
}

function isArray(object){
    return object && typeof object==='object' && Array.isArray(object)
}
  • 檢測(cè)null數(shù)據(jù)類型的方法
function isNull(object){
    return Object.prototype.toString.call(object) === '[object Null]'
}
function isNull(object){
    return object === null
}
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,460評(píng)論 6 538
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 99,067評(píng)論 3 423
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人,你說(shuō)我怎么就攤上這事。” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 177,467評(píng)論 0 382
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我,道長(zhǎng),這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 63,468評(píng)論 1 316
  • 正文 為了忘掉前任,我火速辦了婚禮,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 72,184評(píng)論 6 410
  • 文/花漫 我一把揭開(kāi)白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 55,582評(píng)論 1 325
  • 那天,我揣著相機(jī)與錄音,去河邊找鬼。 笑死,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,616評(píng)論 3 444
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起,我...
    開(kāi)封第一講書(shū)人閱讀 42,794評(píng)論 0 289
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 49,343評(píng)論 1 335
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 41,096評(píng)論 3 356
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 43,291評(píng)論 1 371
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,863評(píng)論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 44,513評(píng)論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 34,941評(píng)論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 36,190評(píng)論 1 291
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 52,026評(píng)論 3 396
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 48,253評(píng)論 2 375

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