资讯专栏INFORMATION COLUMN

关于NaN

jubincn / 3063人阅读

摘要:它有两个重要的性质与任何值都不相等,包括自身任何涉及的操作都会返回。关于是对象的一个方法,比较诡异的是并不是判断参数本身是不是,而是判断是不是。返回的结果是一个布尔值。先用转换参数,再判断转换后的结果是不是不等于自身。

昨天看到一个面试题:怎样实现 isNaN() 方法?

细细研究了一下 NaN,发现这个东西不常用,坑却异常多,颇有 “茴” 字有几种写法的感觉,这里记录下总结的东西吧。

NaN 是什么

NaNNot a Number(非数值),但它是一个特殊的数值,所以:

typeof(NaN)  // "number"

编码时很少直接使用 NaN,通常是在计算失败时,作为 Math 的某个方法的返回值出现的。

它有两个重要的性质:

NaN与任何值都不相等,包括NaN自身:

alert(NaN == NaN)  // false
alert(NaN === NaN)  // false

任何涉及 NaN的操作都会返回NaN

哪些情况会产生NaN? 1. 计算

JS 在进行加减乘除运算之前,会先调用 Number()方法,将非数值的运算项转化为数值,如果转换失败就返回NaN,比如:

1-"a";   // NaN

首先是执行Number("a"),不能成功转化为数值,返回NaN,再利用NaN的第二条性质:任何涉及 NaN的操作都会返回NaN,所以最终的结果是NaN

2. 类型转换

当一个值不能被NumberparseIntparseFloat成功转换为数值,就返回NaN,举例:

Number("123.456abc");   // NaN
parseInt("123.456abc");  // 123
parseFloat("123.456abc"); // 123.456

Number("abc");  // NaN
parseInt("abc");  // NaN
parseFloat("abc");  // NaN

Number([]);  // 0
parseInt([]);  // NaN
parseFloat([]);  // NaN

Number("");  // 0
parseInt("");  // NaN
parseFloat("");  // NaN

Number({});  // NaN
parseInt({});  // NaN
parseFloat({});  // NaN

这里要注意三者之间的差异,我的理解是 parseIntparseFloat会尽量将参数值转化为数值。

关于isNaN()

isNaNwindow对象的一个方法,比较诡异的是:isNaN(x)并不是判断参数x本身是不是NaN,而是判断Number(x)是不是NaN。也就是说先用Number()去转化参数,再去判断转化的结果。返回的结果是一个布尔值。

isNaN(NaN);  // true
isNaN(123);  // false
isNaN("abc");  //true
isNaN("123abc"); //true

isNaN({});  // true,因为Number({})=NaN
isNaN("");  // false, 因为Number("")=0
isNaN([]);  // false,因为Number([])=0

可以看到最后, 空字符串"" 和 空数组[]显然是非数值,而isNaN返回了false,原因就是Number转换在作怪,这点还是很诡异的...所以我选择慎用...

那么isNaN是怎么实现的呢,原理就是利用NaN的第一条性质:NaN与任何值都不相等,包括NaN自身。

var isNaNA = function(value) {
    var n = Number(value);
    return n !== n;
};

先用Number()转换参数,再判断转换后的结果是不是不等于自身。

而 MDN 上给的实现方式是这样的:

var isNaNB = function(value) {
    var n = parseInt(value);
    return n !== n;
};

我觉得是有问题的,因为:

isNaN("123abc");    // true
isNaNA("123abc");   // true
isNaNB("123abc");   // false
Number.isNaN()

ES6 中的Number.isNaN()是一个判断NaN的升级版,和isNaN()不同的是,Number.isNaN()不会强制转化参数,直接对参数本身做判断,这样只有参数显示等于NaN,才会返回true

Number.isNaN(NaN);  // true,其他情况都返回 false

它的实现原理是:

function isNaNC (value) {
    return typeof(value) === "number" && isNaN(value);
}

算了,还是不纠结了....

参考

MDN isNaN()
JavaScript中的 NaN 与 isNaN

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/108419.html

相关文章

  • 关于javascript中类型判断的那些疑惑

    摘要:对于复杂类型它的每个实例都有属性。当检测实例时优于因为能检测这段代码是从的。补充以下结果,发现第三种方法也能正确判断出。我们知道结果是那如何判断两个变量呢比较两个变量,使用的即可。 Javascript中数据类型分为两种: 简单数据类型:Undefined, NULL, Boolean, Number, String 复杂数据类型:Object 接下来我们就来看看怎么做数据类型判别...

    李增田 评论0 收藏0
  • 【JS】关于JS的一些知识点(JS基础,纯记录)

    摘要:如何让根据拆箱转换,以及的隐式转换,可以如下写为什么计算机中所有的数据都是以二进制存储的,所以在计算机计算时要把数据先转换成二进制进行计算,然后把计算结果转换成十进制。会存在精度丢失问题和的二进制都是以无线循环的小数的二进制的二进制 本想着记笔记里,但是笔记里没有分类,还是以文章的形式,当个人总结吧,这一篇就当作JS基础篇的记录吧,有修改的和新增的持续更新~ 关于JS的一些小技巧 1:...

    SwordFly 评论0 收藏0
  • 关于javascrip ==(等号) 和===(恒等)判断

    摘要:与所有值都不相等,包括它自己判断规则,两边值类型不同的时候,要先进行类型转换,再比较。判断一个值是否是,只能用来判断如果两个都是字符串,每个位置的字符都一样,那么相等否则不相等。等号如果两个值类型相同,进行比较。 说明 在JavaScript中,下面的值被当做假(false),除了下面列出的值,都被当做真(true): false null undefined 空字符串 数字 0 N...

    joywek 评论0 收藏0
  • Js中的Number

    摘要:如果参数不是数值都返回去掉非数字部分返回数字部分遇到的第一个非数字停止相比可以多识别一个和是将全局方法和,移植到对象上面,行为完全保持不变。 关于Number的常用方法和注意点 NaN NaN 是代表非数字的特殊属性 NaN 注意点 NaN不是一个数 但是属于number类型 typeof NaN //number NaN和NaN不相等 NaN == NaN //false 何时会出现...

    LiuZh 评论0 收藏0
  • 透彻研究Javascript类型转换

    摘要:注释空数组空对象转换为布尔型也是坑。系统会在自动类型转换的时候调用他们,所以我们通常不需要手动调用他们。严格相等不存在类型转换,对于类型不同的两个值直接返回。 Javascript 中有5种基本类型(不包括 symbol),以及对象类型,他们在不同的运算中会被系统转化为不同是类型,当然我们也可以手动转化其类型。 Javascript 类型转换中的坑极多,就连 Douglas Crock...

    dailybird 评论0 收藏0

发表评论

0条评论

jubincn

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<