NaN的深刻理解

最新推荐文章于 2024-12-24 00:12:34 发布

原创最新推荐文章于 2024-12-24 00:12:34 发布 · 453 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#NaN #NaN深刻理解

javascript 专栏收录该内容

61 篇文章

订阅专栏

NaN的深刻理解

NaN，就是 not a number 的缩写，意思就是 不是数字
NaN 是 javascript 里唯一一个和自身不相等的特殊值，即 NaN !== NaN ，换句话说，NaN === NaN 的结果是 false
NaN 不是数字，但是是数字类型，因为 typeof NaN 会返回 number，不是数字，却是数字类型，这个确实有点意思

检验NaN的函数

window.isNaN()
这个函数是 window 自带检验是不是 NaN 的函数，但是这个函数有一点缺陷

console.log(window.isNaN(2)) // false
console.log(window.isNaN("foo")) // true

可以看到2确实不是 NaN，因为2就是一个数字，但是很明显 foo 不是一个数字，但是它也不是 NaN，因此 console.log(window.isNaN(“foo”)) 应该返回 false，而不应该只 true
不过这个缺陷在ES6之后可以使用 Number.isNaN() 这个函数来解决
Number.isNaN()

console.log(Number.isNaN(2)) // false
console.log(Number.isNaN("foo")) // false

可以很清楚的看到确实 Number.isNaN() 弥补了 window.isNaN() 的缺陷，因此以后建议大家使用 Number.isNaN() 来检测是不是 NaN

Number.isNaN()的原理

虽然 Number.isNaN() 可以相当精准的检测是不是 NaN，但是可以思考一下他是怎么实现的？
结合 window.isNaN() 的缺陷，如果想要检测一个字符是不是 NaN，首先这个字符必须是数字类型，因为别的类型肯定不是数字类型，既然不是数字类型，那么肯定不是 NaN，因为 NaN 是数字类型，为此，可以自定义一个模拟 Number.isNaN() 的函数 Number.numberIsNaN()
Number.numberIsNaN()的实现

if(!Number.numberIsNaN){
    Number.numberIsNaN = function(o){
       return (
          typeof o === "number" && window.isNaN(o)
       )
    }
}
console.log(Number.numberIsNaN(2)) // false
console.log(Number.numberIsNaN("foo")) // false

首先确定是数字类型，然后再确认是NaN，然后因此就是NaN
Number.numberIsNaN()的另一种实现
因为 NaN 是 javascript 中唯一一个不等于自身的值，所以可以这样来检验

if(!Number.numberIsNaN){
    Number.numberIsNaN = function(o){
       return (
          o !== o
       )
    }
}
console.log(Number.numberIsNaN(2)) // false
console.log(Number.numberIsNaN("foo")) // false

这样就实现了检测 NaN