記isNaN與Number.isNaN的區別

Render 發布于2019-08-26 11:57 / 2532人閱讀

摘要：有一次項目中發現原來和是有著不一樣的判斷結果。要了解他們的區別，首先得明確到底是什么在的官方解釋中是一個全局代表的值。目前的結論的類型是，這還是有點令人困惑。但從我們上述對的理解來看，這樣的判斷顯然不正確。

有一次項目中發現原來isNaN和Number.isNaN是有著不一樣的判斷結果。記錄一下避免下次踩坑。

要了解他們的區別，首先得明確NaN到底是什么？

在MDN的官方解釋中

The global NaN property is a value representing Not-A-Number.

NaN是一個全局代表“Not-A-Number”的值。這樣的解釋個人覺得還是有些模糊。

在You-Dont-Know-JS中給出了更詳細的解釋：

NaN literally stands for "not a number", though this label/description is very poor and misleading, as we"ll see shortly. It would be much more accurate to think of NaN as being "invalid number," "failed number," or even "bad number," than to think of it as "not a number."

大家應該也知道：typeof NaN === "number"。

那么結合"invalid number"、"failed number"、"bad number"等描述說明NaN首先得是一個Number類型的值，其次再判斷是不是“not a number”。

目前的結論：”not-a-number“的類型是number，這還是有點令人困惑。我們來看下的You-Dont-Know-JS中的場景描述：（怕翻譯產生歧義還是直接貼了原文）

NaN is a kind of "sentinel value" (an otherwise normal value that"s assigned a special meaning) that represents a special kind of error condition within the number set. The error condition is, in essence: "I tried to perform a mathematic operation but failed, so here"s the failed number result instead."

再來看一個例子：

var a = 2 / "foo";        // NaN
typeof a === "number";    // true

看到這里相信大家對NaN已經有了較為完整的認識。那么我們如何來判斷計算產生的結果是NaN呢？

JS原生提供了isNaN的方法，拿上面的例子來舉例：

var a = 2 / "foo";
isNaN(a) // true;

看似沒什么問題，但其實isNaN是有著致命的缺陷。它把對NaN的判斷就如同字面意思所寫的那樣：test if the thing passed in is either not a number or is a number。但從我們上述對NaN的理解來看，這樣的判斷顯然不正確。
例如：

var a = 2 / "foo";
var b = "foo";

a; // NaN
b; // "foo"

window.isNaN( a ); // true
window.isNaN( b ); // true

b顯然是一個字符串，從我們之前對NaN的定義(NaN的類型是number)來看，b明顯不應該是NaN。這個Bug由來許久，所以在es6中提供了替代方案Number.isNaN。我們來看下polyfill就知道他修復了什么問題。

if (!Number.isNaN) {
  Number.isNaN = function(n) {
    return (
      typeof n === "number" &&
             window.isNaN(n)
    );
  };
}

再試驗下剛才的例子：

var a = 2 / "foo";
var b = "foo"

Number.isNaN(a); // true
Number.isNaN(b); // false

就能得出我們理想的結果了。

還有一種polyfill非常簡單，利用了NaN不等于他自身的特性，NaN是唯一有此特性的值，其他值都等于它們自身（包括undefined和null）:

if (!Number.isNaN) {
    Number.isNaN = function(n) {
        return n !== n;
    };
}

最后就是建議大家都使用Number.isNaN來進行判斷，如果用了eslint的話，那只寫isNaN是會報錯的哦。

GPU云服務器云服務器空間與域名的區別接口與類的區別云服務與云盤的區別主機與vps的區別

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/107904.html

從 Number.isNaN 與 isNaN 的區別說起例子

摘要：但是跟普通的是的不一樣的是，代表這一意義。的沒有的情況下，可以采用以下簡單來看，就是在原有的基礎上增加了一個的判斷，因為的是。還有一種更加簡單的實現利用了只有不跟自己相等的特性。不過我們可以通過以上方式來解釋判斷為什么會出現這樣的情況了。例子大家先看一看下面這個例子， isNaN(NaN); isNaN(A String); isNaN(undefined); isNaN({...

2bdenny 2019-08-22 11:14 評論0 收藏0
你可能不知道的 NaN 以及 underscore 1.8.3 _.isNaN 的一個 BUG

摘要：全局屬性表示的值，顧名思義，就是表示不是一個數字。值得注意的是，是引入的，可以用上面的。而能通過函數的只有。該認為，應該返回。這篇文章并不在我的 underscore 源碼解讀計劃中，直到 @pod4g 同學回復了我的 issue（詳見 https://github.com/hanzichi/underscore-analysis/issues/2#issuecomment-2273...

huashiou 2019-08-19 18:35 評論0 收藏0
lodash源碼分析之NaN不是NaN

摘要：梁文道暗戀到偷窺本文為讀源碼的第五篇，后續文章會更新到這個倉庫中，歡迎也會同步倉庫的更新，地址本篇分析的是函數。源碼分析來看下的源碼其實的源碼其實就只有這么一句。但是返回的是規定和都為時返回的是。暗戀之純粹，在于不求結果，完全把自己鎖閉在一個單向的關系里面。——梁文道《暗戀到偷窺》本文為讀 lodash 源碼的第五篇，后續文章會更新到這個倉庫中，歡迎 star：pocket-lo...

gaomysion 2019-08-21 18:37 評論0 收藏0
ES6之數值的擴展

摘要：二進制和八進制提供了二進制和八進制數值的新的寫法，分別用前綴或和或表示。八進制聲明八進制的英文單詞是，也是以零開始的，然后第二個位置是歐，然后跟上八進制的值就可以了。用來檢查一個數值是否為有限的。對于非數值，內部使用方法將其先轉為數值。二進制和八進制 ES6 提供了二進制和八進制數值的新的寫法，分別用前綴0b（或0B）和0o（或0O）表示。二進制聲明：二進制的英文單詞是Binar...

xiguadada 2019-08-21 18:32 評論0 收藏0
js常見基礎對象屬性方法 (二)

摘要：常見基礎對象屬性方法二關于的箭頭函數的返回對象的問題箭頭函數具有隱式返回的特性。返回值函數累計處理的結果。語句將某個對象添加的作用域鏈的頂部，如果在中又某個未使用命名空間的變量，跟作用域鏈中的某個屬性同名，則這個變量將指向這個屬性值。 js常見基礎對象屬性方法 (二) 關于es6的箭頭函數的返回對象的問題箭頭函數(=>)具有隱式返回的特性。如果某個函數體只有單個表達式，你就可以忽略r...

Donald 2019-08-23 10:50 評論0 收藏0