在JavaScript的数字类型Number中,我们最常使用的大概是整数类型与浮点数类型,但除这两者外,还有个特殊的存在NaN,为什么NaN!==NaN?我们如何判断一个值是否等于NaN呢?这篇文章好好聊聊NaN。

1.NaN是什么?

NaN全称是Not-A-Number(不是一个数字),我们可以通过Number.NaN来获得一个NaN,在类型转换失败时,我们常常会得到一个NaN,需要注意的是,NaN是JS中唯一一个自身不相等的存在。

Number.NaN //NaN
NaN === NaN //false

2.为什么NaN!==NaN?

NaN只是Number上的一个静态属性。

Number('echo') //NaN

比如Number('echo')会得到NaN,它只是为了告诉你这个值不是一个数字,一种表示方法,而非一个精准有效的值,因此NaN不能参与计算,也无法与自身比较。

3.什么情况下产生NaN

当Number提供的类型转换方法在解析一个值却无法返回数字时:

Number('echo') //NaN

parseInt('echo123') //NaN
parseInt('123echo') // parseFloat('时间跳跃123.1') //NaN
parseFloat('123.1时间跳跃') //123.1

计算中使用-  /   *运算符,参与计算的值转换类型失败时:

1 - '听风是风' //NaN
1 * '123时间跳跃' //NaN
1 / 'echo123' //NaN

特别注意,两个数字0相除也会得到NaN:

0 / 0 //NaN

4.isNaN方法的含义,如何判断一个值严格等于NaN

window上有一个全局方法isNaN(),可能大分部人习惯理解此方法为判断一个值是等于NaN,这是因为is NaN直译就是“是不是NaN”所带来的误解,其实本意不是这样:

isNaN(123) //false
isNaN('123时间跳跃') //true
isNaN(NaN) //true

当我们向isNaN传递一个参数,它的本意是通过Number()方法尝试转换参数的类型为Number,如果转换成功返回false,否则转返回true,它只是判断这个参数能否转成数字而已,并不是判断是否严格等于NaN

所以当你要判断某个值是否严格等于NaN时无法使用isNaN()方法,毕竟你传递任意字符串它都会返回true。

ES6中提供了一个Number.isNaN()方法用于判断一个值是否严格等于NaN:

Number.isNaN(NaN)//true

与isNaN最大的区别是,Number.isNaN不存在转换类型的行为,这点是最大的不同:

isNaN(NaN) //true
Number.isNaN(NaN) //true isNaN('听风是风') //true
Number.isNaN('听风是风') //false

我们在前面说过,NaN是唯一一个与自身不相等的特殊值,如果你觉得Number.isNaN存在兼容问题,也可以利用这个特点自己定义验证方法:

const ISNAN = (value) => value !== value;
ISNAN('听风是风'); //false
ISNAN(123); //false
ISNAN(NaN); //true

参考资料:

JavaScript中的 NaN 与 isNaN

MDN--NaN

MDN--isNaN

js中的NaN,isNaN与Number.isNaN的区别,如何判断一个值严格等于NaN的更多相关文章

  1. 神马是 NaN,它的类型是神马?怎么测试一个值是否等于 NaN?

    NaN 是 Not a Number 的缩写,JavaScript 的一种特殊数值,其类型是 Number,可以通过 isNaN(param) 来判断一个值是否是 NaN: console.log(i ...

  2. 什么是NaN?它的类型是什么?如何可靠的测试一个值是否等于NaN?

    NaN属性表示"不是数字"的值.这个特殊值是由于一个操作数是非数字的(例如"abc"/4)或者因为操作的结果是非数字而无法执行的. 虽然看起来很简单,但是NaN ...

  3. js中isNaN和Number.isNaN的区别

    isNaN 当我们向isNaN传递一个参数,它的本意是通过Number()方法尝试将这参数转换成Number类型,如果成功返回false,如果失败返回true. 所以isNaN只是判断传入的参数是否能 ...

  4. 浅谈JS中的!=、== 、!==、===的用法和区别 JS中Null与Undefined的区别 读取XML文件 获取路径的方式 C#中Cookie,Session,Application的用法与区别? c#反射 抽象工厂

    浅谈JS中的!=.== .!==.===的用法和区别   var num = 1;     var str = '1';     var test = 1;     test == num  //tr ...

  5. js中的text(),html() ,val()的区别

    js中的text(),html() ,val()的区别 text(),html() ,val()三个方法用于html元素的存值和取值,但是他们各有特点,text()用于html元素文本内容的存取,ht ...

  6. js中把字符串转换成number格式方法

    方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把值转换成浮点数.只有 ...

  7. js中直接调用函数和new函数的区别

    如果函数返回值为常规意义上的值类型(Number.String.Boolean)时,new函数将会返回一个该函数的实例对象,而如果函数返回一个引用类型(Object.Array.Function),则 ...

  8. [置顶] js中如何复制一个对象,如何获取所有属性和属性对应的值

    在js中如何复制一个对象,例如如下一个js对象. 如果知道这个对象的所有属性自然就可以重新new一个,然后对每个属性赋值,就可以做到,但如果不知道呢?如何创建一个内容相同 的对象呢? var obj= ...

  9. js中箭头函数和普通函数this的区别

    最近在学习angularJs的时候由于里面涉及到了箭头函数,箭头函数除了声明上有点区别以外,和普通函数最主要的区别还是在this的问题上. Js中函数中嵌套的函数this不会 “继承”.比如说以下代码 ...

随机推荐

  1. 一、VUE项目BaseCms系列文章:项目介绍与环境配置

    一.项目效果图预览: 二.项目介绍 基于 elementui 写一个自己的管理后台.这个系列文章的目的就是记录自己搭建整个管理后台的过程,希望能帮助到那些入门 vue + elementui 开发的小 ...

  2. mysql从5.6升级到5.7后出现 Expression #1 of ORDER BY clause is not in SELECT list,this is incompatible with DISTINCT

    [问题]mysql从5.6升级到5.7后出现:插入数据和修改数据时出错Caused by: com.ibatis.common.jdbc.exception.NestedSQLException: - ...

  3. 31(2).密度聚类---Mean-Shift算法

    Mean-Shift 是基于核密度估计的爬山算法,可以用于聚类.图像分割.跟踪等领域.

  4. python模拟进程状态

    python模拟进程状态 我在参考资料中看到了两种实现方式,都做了尝试 代码1 from transitions import Machine class Matter: pass model = M ...

  5. CALL和RET指令实验

    实验10 1.在屏幕8行3列,用绿色显示data段中的字符串 assume cs:code data segment db data ends code segment start: ;行 ;列 ;颜 ...

  6. HTML连载53-网易注册界面实战之content的头部、content注册信息

    一. 这次完成了content部分的右边图片以及content的top部分的边角填充 <!DOCTYPE html> <html lang="en"> &l ...

  7. 压测 swoole_websocket_server 性能

    概述 这是关于 Swoole 入门学习的第十篇文章:压测 swoole_websocket_server 性能. 第九篇:Swoole Redis 连接池的实现 第八篇:Swoole MySQL 连接 ...

  8. Java连接数据库 #07# MyBatis Generator简单例子

    MyBatis Generator是一个可以帮助我们免去手写实体类&接口类以及XML的代码自动生成工具. 下面,通过一个简单的例子介绍MyBatis Generator如何使用. 大体流程如下 ...

  9. Spring Boot AOP解析

    Spring Boot AOP 面向切面编程(AOP)通过提供另一种思考程序结构的方式来补充面向对象编程(OOP). OOP中模块化的关键单元是类,而在AOP中,模块化单元是方面. AOP(Aspec ...

  10. Actor模型(分布式编程)

    Actor的目的是为了解决分布式编程中的一系列问题.所有消息都是异步交付的,因此将消息发送方与接收方分开,正是由于这种分离,导致actor系统具有内在的并发性:可以不受限制地并行执行任何拥有输入消息的 ...