JavaScript 中的 NaN 和 isNaN

1、NaN

NaN 即 Not a Number ， 不是一个数字。那么 NaN 到底是什么呢？ 在 JavaScript 中，整数和浮点数都统称为 Number 类型 。除此之外，Number 类型还有一个很特殊的值，即 NaN 。它是 Number 对象上的一个静态属性，可以通过 Number.NaN 来访问 。 

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

在 ECMAScript v1 和其后的版本中，还可以用预定义的全局属性 NaN 代替 Number.NaN 。

1	console.log(NaN);//NaN

在以下两种场景中，可能会产生 NaN 值 。

【1】表达式计算

一个表达式中如果有减号 (-)、乘号 (*) 或 除号 (/) 等运算符时，JS 引擎在计算之前，会试图将表达式的每个分项转化为 Number 类型（使用 Number(x) 做转换）。如果转换失败，表达式将返回 NaN 。

1 2 3 4 5 6

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 类型时，才会做数字相加运算，如果其中有一个变量是字符串，则会将两边都作为字符串相加。

1 2	5+4+"6" ="96" ； 1+"2"+ 3 = "123"

【2】类型转换

直接使用 parseInt，parseFloat 或 Number 将一个非数字的值转化为数字时，表达式返回 NaN 。

1 2 3 4

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

对于 数字+字符 的值，其转化结果会有所不同：

1 2 3 4

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

Number 转换的是整个值，而不是部分值；parseInt 和 parseFloat 只转化第一个无效字符之前的字符串。 另外，一元加操作符也可以实现与 Number 相同的作用。　

1 2 3 4

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

因此，当一个字符串不能被 Number、parseInt 或 parseFloat 成功转换时，就返回 NaN，表示该字符串无法被识别为数字类型，这是一个异常状态，并不是一个确切的值。 

2、isNaN

isNaN() 是一个全局方法，它的作用是检查一个值是否能被 Number() 成功转换 。 如果能转换成功，就返回 false，否则返回 true 。

1 2 3 4 5

isNaN(NaN)   //true 不能转换 isNaN("123")  //false 能转换 isNaN("abc")   //true 不能转换 isNaN("123abc")  //true 不能转换 isNaN("123.45abc")//true 不能转换

可以看出，isNaN() 没有办法判断某个值本身是否为 NaN 。如果想要知道某个值本身是否为 NaN，可以利用 NaN 不等于自身 这一特性来判断。

1 2 3

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

另外，ES6 在 Number 对象上也提供了 isNaN()  方法，和全局方法 isNaN() 不同的是，它用于判断某个值本身是否为 NaN，而不需要进行类型转换。

1 2 3

Number.isNaN("123");//false 本身不是NaN Number.isNaN("abc");//false 本身不是NaN Number.isNaN(NaN);// true　本身是NaN

 

原创发布 @一像素  2016 博客园