关于jQuery $.isNumeric vs. $.isNaN vs. isNaN


Posted in Javascript onApril 15, 2013

在jQuery中,有几种方式可以判断一个对象是否是数字,或者可否转换为数字。
首先,jQuery.isNaN()在最新版本中已经被移除了(1.7之后),取而代之的是  jQuery.isNumeric ()。这并不奇怪,因为jQuery.isNaN() 同Javascript内置的isNaN()名字相同,但是语义却不完全相同,在一定意义上会造成歧义。 jQuery.isNumeric ()有着与其相似的功能,同时也解决了歧义问题。

jQuery.isNumeric ()检查传进的参数是否是数字或者可否转换为数字;Javascript 内置的isNaN() 检查传进的参数是否是一个合法的数字,典型的例子是0/0。

具体区别可以看测试:

测试数据:

var values = [
"-10",
,
xFF,
"0xFF",
"8e5",
.1415,
+10,
,
"",
{},
NaN,
null,
true,
Infinity,
undefined,
false
];

使用jQuery verision1.6:

for( var index in values ) {
    var v = values[ index ];
    $( 'table' ).append( '<tr><td>'+v+'</td><td>'
                         +(!isNaN( v )?"true":"false")
                         +'</td><td>'
                         +(!$.isNaN( v )?"true":"false")
                         +'</td></tr>' );
}

输出:

  !isNaN() !$.isNaN()
-10 true true
16 true true
255 true true
0xFF true true
8e5 true true
3.1415 true true
10 true true
100 true true
  true false
[object Object] false false
NaN false false
null true false
true true false
Infinity true false
undefined false false

使用 jQuery version1.7

for( var index in values ) {
    var v = values[ index ];
    $( 'table' ).append( '<tr><td>'+v+'</td><td>'
                         +(!isNaN( v )?"true":"false")
                         +'</td><td>'
                         +($.isNumeric( v )?"true":"false")
                         +'</td></tr>' );
}

输出:

!isNaN() $.isNumeric()
-10 true true
16 true true
255 true true
0xFF true true
8e5 true true
3.1415 true true
10 true true
100 true true
  true false
[object Object] false false
NaN false false
null true false
true true false
Infinity true false
undefined false false

可以看出,$.isNumeric() 跟 !$.isNaN() 结果是一样的, 而 jQuery $.isNumeric() 同Javascript 自带的!isNaN()在对空字符串、null、true/false、Infinity的处理是不同的。因为isNaN()只是检查传入的值是否是NaN类型。

NaN (Not a Number)是一个数字数据类型,表明未定义(undefined )或无法表示(unrepresentable )的值,尤其是浮点数计算值。

因此,isNaN(null) == false 在语义上是正确的,因为null不是NaN(事实上null、ture/false等等会先转为数字0)。但是如果用!isNaN()来判断传入的值可否转换为数字,又不大恰当。而Javascript另一种方式 typeof num == 'number' 则无法检测字符串情况。因此如果不使用 jQuery $.isNumeric(),则最好还是重写一个方法判断,比如用正则来判断或者:

function isNumeric(obj) {
    return !isNaN(parseFloat(obj)) && isFinite(obj);
}
Javascript 相关文章推荐
JavaScript版代码高亮
Jun 26 Javascript
JavaScript高级程序设计 阅读笔记(十七) js事件
Aug 14 Javascript
JQuery each()嵌套使用小结
Apr 18 Javascript
详解javascript函数的参数
Nov 10 Javascript
BootStrap Table对前台页面表格的支持实例讲解
Dec 22 Javascript
JavaScript设计模式之单例模式详解
Jun 09 Javascript
详解Vue整合axios的实例代码
Jun 21 Javascript
vue2过滤器模糊查询方法
Sep 16 Javascript
基于JS开发微信网页录音功能的实例代码
Apr 30 Javascript
详解使用uni-app开发微信小程序之登录模块
May 09 Javascript
VUE注册全局组件和局部组件过程解析
Oct 10 Javascript
Vue 构造选项 - 进阶使用说明
Aug 14 Javascript
深入了解javascript中的prototype与继承
Apr 14 #Javascript
谈谈JavaScript中的函数与闭包
Apr 14 #Javascript
在新窗口打开超链接的方法小结
Apr 14 #Javascript
JS中setTimeout()的用法详解
Apr 14 #Javascript
js验证是否为数字的总结
Apr 14 #Javascript
JS 实现Json查询的方法实例
Apr 12 #Javascript
js弹出层(jQuery插件形式附带reLoad功能)
Apr 12 #Javascript
You might like
redis 队列操作的例子(php)
2012/04/12 PHP
基于Discuz security.inc.php代码的深入分析
2013/06/03 PHP
ThinkPHP中I(),U(),$this-&gt;post()等函数用法
2014/11/22 PHP
php阳历转农历优化版
2016/08/08 PHP
PHP通过CURL实现定时任务的图片抓取功能示例
2016/10/03 PHP
php封装的图片(缩略图)处理类完整实例
2016/10/19 PHP
php解析mht文件转换成html的实例
2017/03/13 PHP
PHP中rename()函数的妙用讲解
2019/02/28 PHP
Yii redis集合的基本使用教程
2020/06/14 PHP
goto语法在PHP中的使用教程
2020/09/17 PHP
JavaScript 异步调用框架 (Part 3 - 代码实现)
2009/08/04 Javascript
HTML颜色选择器实现代码
2010/11/23 Javascript
jquery延迟加载外部js实现代码
2013/01/11 Javascript
jquery使用ajax实现微信自动回复插件
2014/04/28 Javascript
kindeditor修复会替换script内容的问题
2015/04/03 Javascript
Vuejs第十一篇组件之slot内容分发实例详解
2016/09/09 Javascript
Angular使用ng-messages与PHP进行表单数据验证
2016/12/28 Javascript
jQuery实现的动态文字变化输出效果示例【附演示与demo源码下载】
2017/03/24 jQuery
手机端转换rem适应
2017/04/01 Javascript
vue 使用ref 让父组件调用子组件的方法
2018/02/08 Javascript
剖析Angular Component的源码示例
2018/03/23 Javascript
webpack4+Vue搭建自己的Vue-cli项目过程分享
2018/08/29 Javascript
layui-select动态选中值的例子
2019/09/23 Javascript
[03:41]DOTA2上海特锦赛小组赛第三日recap精彩回顾
2016/02/28 DOTA
[49:08]Secret vs VP 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
python登录QQ邮箱发信的实现代码
2013/02/10 Python
浅谈python中截取字符函数strip,lstrip,rstrip
2015/07/17 Python
python3实现公众号每日定时发送日报和图片
2018/02/24 Python
Python中的pack和unpack的使用
2018/03/12 Python
Django如何使用第三方服务发送电子邮件
2019/08/14 Python
节日快乐! Python画一棵圣诞树送给你
2019/12/24 Python
利用python实现逐步回归
2020/02/24 Python
使用CSS3编写灰阶滤镜来制作黑白照片效果的方法
2016/05/09 HTML / CSS
美国最大的万圣节服装网站:HalloweenCostumes.com
2017/10/12 全球购物
个人作风纪律整顿整改措施
2014/10/25 职场文书
详解Redis实现限流的三种方式
2021/04/27 Redis