JavaScript中的 NaN 與 isNaN

NaN

NaN 即 Not a Number ，不是一個數字。 在 JavaScript 中，整數和浮點數都統稱爲 Number 類型 。除此以外，Number 類型還有一個很特殊的值，即 NaN 。它是 Number 對象上的一個靜態屬性，能夠經過 Number.NaN 來訪問 。 

console.log(Number.NaN); // NaN

在 ECMAScript v1 和其後的版本中，還能夠用預約義的全局屬性 NaN 代替 Number.NaN 。

console.log(NaN); // NaN

在如下兩種場景中，可能會產生 NaN 值 。

【1】表達式計算

一個表達式中若是有減號 (-)、乘號 (*) 或 除號 (/) 等運算符時，JS 引擎在計算以前，會試圖將表達式的每一個分項轉化爲 Number 類型（使用 Number(x) 作轉換）。若是轉換失敗，表達式將返回 NaN 。

100 - '2a' ; // NaN
'100' / '20a'; // NaN
'20a' * 5 ; // NaN
undefined - 1; // NaN, Number(undefined) == NaN
[] * 20 ; // 0, Number([]) == 0
null - 5; // -5, Number(null) == 0 

而 加號 (+) 不會將其兩邊的變量轉化爲 Number 類型，這是由於JS表達式的執行順序是按照運算符的優先級從左到右依次進行的，若是加號 (+) 兩邊的變量都是 Number 類型時，纔會作數字相加運算，若是其中有一個變量是字符串，則會將兩邊都做爲字符串相加。

5 + 4 + '6' = '96';
1 + '2' + 3 =  '123'

【2】類型轉換

直接使用 parseInt，parseFloat 或 Number 將一個非數字的值轉化爲數字時，表達式返回 NaN 。

'abc' - 3   // NaN
parseInt('abc')  // NaN
parseFloat('abc') // NaN
Number('abc')    // NaN

對於 數字+字符 的值，其轉化結果會有所不一樣：

Number('123abc'); // NaN
parseInt('123abc'); // 123
parseInt('123abc45'); // 123
parseFloat('123.45abc');// 123.45

Number 轉換的是整個值，而不是部分值；parseInt 和 parseFloat 只轉化第一個無效字符以前的字符串。 另外，一元加操做符也能夠實現與 Number 相同的做用。　

+ '12abc'; // NaN
+ '123'; // 123
+ '123.78'; // 123.78
+ 'abc'; // NaN

所以，當一個字符串不能被 Number、parseInt 或 parseFloat 成功轉換時，就返回 NaN，表示該字符串沒法被識別爲數字類型，這是一個異常狀態，並非一個確切的值。 

isNaN

isNaN() 是一個全局方法，它的做用是檢查一個值是否能被 Number() 成功轉換 。 若是能轉換成功，就返回 false，不然返回 true 。

isNaN(NaN)    // true 不能轉換
isNaN('123')   // false 能轉換
isNaN('abc')    // true 不能轉換
isNaN('123ab')   // true 不能轉換
isNaN('123.45abc') // true 不能轉換

能夠看出，isNaN() 沒有辦法判斷某個值自己是否爲 NaN 。若是想要知道某個值自己是否爲 NaN，能夠利用 NaN 不等於自身 這一特性來判斷。

function selfIsNaN(value){
    return value !== value
}

另外，ES6 在 Number 對象上也提供了 isNaN()  方法，和全局方法 isNaN() 不一樣的是，它用於判斷某個值自己是否爲 NaN，而不須要進行類型轉換。

Number.isNaN('123'); // false 自己不是NaN
Number.isNaN('abc'); // false 自己不是NaN
Number.isNaN(NaN); // true　自己是NaN

 

原創發佈 @一像素  2016 博客園 

 

【參考資料】

[1] 詳解 ECMAScript 數據類型