JavaScript中Number.isNaN 和 isNaN 的區(qū)別詳解
前言
本文和大家分享一個(gè)前幾天寫代碼踩的坑,筆者在業(yè)務(wù)邏輯中需要對(duì)一個(gè)值進(jìn)行 NaN
的判斷,由于筆者的不嚴(yán)謹(jǐn),使用了isNaN
,從而引起了Bug
,也正是因?yàn)檫@個(gè),筆者才知道了 isNaN
和 Number.isNaN
的區(qū)別,如果你認(rèn)為這倆沒區(qū)別,覺得 isNaN
是歷史遺留的全局變量,后面又加到 Number
上的話,建議你接著往下看。如果你知道他們的區(qū)別,可以劃走了。??
筆者將從以下兩個(gè)方面來描述這個(gè)知識(shí)點(diǎn):
- 什么是
NaN
。 isNaN
和Number.isNaN
的區(qū)別是什么。
什么是NaN
JS
中的 NaN
,是 Not a Number
的縮寫,代表一個(gè)值 或者 一個(gè)表達(dá)式的值 不是一個(gè)數(shù)字。它有以下幾個(gè)特點(diǎn):
- 它是全局作用域中的一個(gè)變量。
Number.NaN
和NaN
是同一個(gè)東西,有相同的特性,只不過一個(gè)是全局變量;一個(gè)是Number
上的屬性。但是它倆也不能劃等號(hào),畢竟NaN
自己都不等于自己。NaN
涉及數(shù)學(xué)運(yùn)算,通常情況下都會(huì)返回NaN
,但是還有例外,看下圖:
NaN
涉及關(guān)系比較(>
,<
,>=
,<=
)時(shí),都返回false
。
什么情況下會(huì)得到NaN
呢?
- 顯式將非
NumBer
類型轉(zhuǎn)為Number
類型,比如Number('aaa')
。 - 在調(diào)用一些需要數(shù)字類型參數(shù)的
API
時(shí),可能API
內(nèi)部會(huì)做轉(zhuǎn)換,一旦無法轉(zhuǎn)為數(shù)字,可能就返回了NaN
,比如Math.abs('aaa')
。 - 等等......
那在平時(shí)開發(fā)中,為了保證我們寫的代碼邏輯運(yùn)行正常,就可能需要對(duì) NaN
判斷,接下來我們就來看下判斷 NaN
的兩個(gè) API
有啥不同。
isNaN 和 Number.isNaN 的區(qū)別
首先,這倆 API
都能夠用于判斷 NaN
,這一點(diǎn)從 API
的名字就能看出,然后各位看圖總結(jié)不同的地方:
不同點(diǎn):
Number.isNaN
是直接拿參數(shù)與NaN
去比,也就是說,你一定要傳NaN
進(jìn)去才返回true
。至于怎么比的,咱也不知道,反正不是===
,因?yàn)?NaN
的特性——自己不等于自己。isNaN
會(huì)先嘗試將參數(shù)轉(zhuǎn)換成數(shù)字,如果可以轉(zhuǎn)換成數(shù)字,則返回false
;否則返回true
。
咱們不妨來討論一下,Number.isNaN
內(nèi)部的實(shí)現(xiàn),肯定不是:
Number.isNaN = (target) => target === NaN // 自己不等于自己
我猜可能是:
// 因?yàn)橹挥袀?`NaN` 進(jìn)去才返回 `true`,而 NaN 是 Number 類型 // 再加上 `NaN + '' === 'NaN'` // 也許是對(duì)的 Number.isNaN = (target) => Object.prototype.toString.call(target) === '[object Number]' && target+'' === 'NaN'
總結(jié)
本文主要內(nèi)容為:
NaN
的特性isNaN
和Number.isNaN
的區(qū)別,一句話總結(jié):Number.isNaN
只有傳NaN
進(jìn)去才返回true
;isNaN
傳NaN
或者不能轉(zhuǎn)化為Number
的都會(huì)返回true
。
以后咱們還是不要使用isNaN
為好!
以上就是JavaScript中Number.isNaN 和 isNaN 的區(qū)別詳解的詳細(xì)內(nèi)容,更多關(guān)于JavaScript Number.isNaN和isNaN區(qū)別的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
JavaScript將DOM事件處理程序封裝為event.js 出現(xiàn)的低級(jí)錯(cuò)誤問題
這篇文章主要介紹了JavaScript將DOM事件處理程序封裝為event.js 出現(xiàn)的低級(jí)錯(cuò)誤問題做個(gè)筆錄,以防出現(xiàn)類似錯(cuò)誤,需要的朋友可以參考下2016-08-08JavaScript?顯示一個(gè)倒計(jì)時(shí)廣告牌的實(shí)現(xiàn)示例
本文主要介紹了JavaScript?顯示一個(gè)倒計(jì)時(shí)廣告牌的實(shí)現(xiàn)示例,文中通過示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-04-04JavaScript動(dòng)態(tài)操作表格實(shí)例(添加,刪除行,列及單元格)
這篇文章主要是對(duì)JavaScript動(dòng)態(tài)操作表格實(shí)例(添加,刪除行,列及單元格)進(jìn)行了詳細(xì)的分析介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-11-11javascript設(shè)計(jì)模式之單體模式學(xué)習(xí)筆記
這篇文章主要為大家詳細(xì)介紹了javascript設(shè)計(jì)模式之單體模式學(xué)習(xí)筆記,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-02-02javascript 判斷中文字符長(zhǎng)度的函數(shù)代碼
在很多時(shí)候,我們?cè)谶M(jìn)行數(shù)據(jù)提交數(shù)據(jù)庫(kù)時(shí).先會(huì)用javascript對(duì)其進(jìn)行有效性驗(yàn)證.如一個(gè)中文javascript為的length是1.但是數(shù)據(jù)庫(kù)中會(huì)占二個(gè)字節(jié).容易出錯(cuò)2012-08-08原生JavaScript實(shí)現(xiàn)合并多個(gè)數(shù)組示例
這篇文章主要介紹了原生的JavaScript及jquery實(shí)現(xiàn)合并多個(gè)數(shù)組,很簡(jiǎn)單,很實(shí)用,大家可以看看2014-09-09JS實(shí)現(xiàn)頁(yè)面內(nèi)跳轉(zhuǎn)的簡(jiǎn)單代碼
這篇文章主要介紹了JS實(shí)現(xiàn)頁(yè)面內(nèi)跳轉(zhuǎn)的簡(jiǎn)單代碼,需要的朋友可以參考下2017-09-09解決layer 關(guān)閉當(dāng)前彈窗 關(guān)閉遮罩層 input值獲取不到的問題
今天小編就為大家分享一篇解決layer 關(guān)閉當(dāng)前彈窗 關(guān)閉遮罩層 input值獲取不到的問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-09-09