JavaScript判断是否为数字的方式有哪些

发布时间:2022-06-15 09:20:42 作者:zzz
来源:亿速云 阅读:124

本篇内容主要讲解“JavaScript判断是否为数字的方式有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JavaScript判断是否为数字的方式有哪些”吧!

1. typeof、instanceof、Number.isInteger

typeof判断值是不是基本类型number,比如:

let num = 1;
typeof num === 'number'; // true

instanceof判断值是不是包装类Number,比如:

let num = new Number(1);
num instanceof Number; // true

Number.isInteger判断值是否是整数:

Number.isInteger(1);   // true
Number.isInteger('1'); // false
Number.isInteger(1.1); // false

这几种方式的缺点,都是只能基于类型判断,无法判断字符串是否是数值。

2. parseInt、parseFloat

这个方法的特点,一句话,返回字符串开头最长的有效数字。

我们可以用!isNaN(parseFloat(value))来判断字符串是否是数值。

let str1 = '123';
let str2 = 'abc';
!isNaN(parseFloat(str1)); // true,是数字
!isNaN(parseFloat(str2)); // false,不是数字

parseInt和parseFloat解析的时候遇到非法字符结束,返回解析到的数值。也就是说只要字符串头部是合法数值,那么就能解析出数值,哪怕整体不是数值。比如123abc,会被解析程123。

因此,上面的判断方式还不够严谨,下面的终极方案是比较严谨的方式。

3. isNaN、isFinite

在介绍这两个方法之前,先讲下NaN,它表示Not-a-Number。两个NaN无法直接比较相等,因为我们只知道它不是数值,是啥不确定,也就无法比较相等。

NaN === NaN;         // false
NaN == NaN;          // false
Object.is(NaN, NaN); // false

isNaN和isFinite都会先将传入的值转成数值,再进行判断。ToNumber的规则跟直接使用Number函数一样。一些非数值在类型转换的时候都能转成数值,比如:

Number(true);         // 1
Number(false);        // 0
Number(null);         // 0
Number('');           // 0

对null、true、false、''使用isNaN结果都是false,但是它们本身不是数值,因此不能单独使用isNaN。

4. Number.isNaN、Number.isFinite

这两个方法跟对应的全局方法是不一样的。

区别是全局方法会有强制类型转换,而这两个方法没有强制类型转换:

Number.isNaN(null);      // true
Number.isNaN(true);      // true
Number.isNaN(false);     // true
Number.isNaN('');        // true

可以看,由于没有类型转换,所以Number.isNaN判断null、true、false、''的结果都是true。

但是“副作用”是数字字符串也会得到true:

Number.isNaN('123');    // true

Number.isNaN等价与:

Number.isNaN = Number.isNaN || function(value) {
    return typeof value === "number" && isNaN(value);
}

而Number.isFinite等价于:

if (Number.isFinite === undefined) Number.isFinite = function(value) {
    return typeof value === 'number' && isFinite(value);
}

因此,这两个方法本质上也是基于类型的,没法判断一个字符串是否为数值。

5. 正则表达式

let exp = /^[+-]?\d*(\.\d*)?(e[+-]?\d+)?$/;
exp.test('+1.9');   // true
exp.test('-.1e11'); // true

这个正则可以判断整数、浮点数、正负数和科学计数法。

不过我觉得判断是否是数值用正则,有点小题大做了。

6. 终极方案(推荐)

我们先看方案:

!isNaN(parseFloat(value)) && isFinite(value);

这其实是jquery中$.isNumeric的源码,多么简洁且优雅。

接下来我们看看它的原理,我们以字符串123abc为例,我们应该得到false。

  1. parseFloat('123abc')得到123;

  2. !isNaN(123)得到true;

  3. isFinite('123abc')得到false;

  4. 最终结果为false。

单独使用!isNaN(parseFloat(value))会将123abc当成数值,所以用isFinite额外判断一次,isFinite的另一个作用是排除无穷数。

!isNaN(parseFloat(Infinity));  // true
!isNaN(parseFloat(Infinity)) && isFinite(Infinity); // false

而且,因为parseFloat的解析是纯字符串解析,没有类型转换,所以不会将null、true、false、''当成数值。

!isNaN(parseFloat(null)) && isFinite(null);   // false
!isNaN(parseFloat(true)) && isFinite(true);   // false
!isNaN(parseFloat(false)) && isFinite(false); // false
!isNaN(parseFloat('')) && isFinite('');       // false

到此,相信大家对“JavaScript判断是否为数字的方式有哪些”有了更深的了解,不妨来实际操作一番吧!这里是亿速云网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

推荐阅读:
  1. JavaScript 如何实现判断变量是否为数字
  2. JavaScript中怎么判断变量是否为数字

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

javascript

上一篇:如何为Visual Studio手工安装微软ReportViewer控件

下一篇:Qt如何实现密码显示按钮

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》