关于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 相关文章推荐
比较简单的一个符合web标准的JS调用flash方法
Nov 29 Javascript
JS构建页面的DOM节点结构的实现代码
Dec 09 Javascript
如何使用jquery动态加载js,css文件实现代码
Apr 03 Javascript
中文路径导致unitpngfix.js不正常的解决方法
Jun 26 Javascript
jQuery中RadioButtonList的功能及用法实例介绍
Aug 23 Javascript
JavaScript中访问节点对象的方法有哪些如何使用
Sep 24 Javascript
js简单实现根据身份证号码识别性别年龄生日
Nov 29 Javascript
jquery+easeing实现仿flash的载入动画
Mar 10 Javascript
d3.js实现立体柱图的方法详解
Apr 28 Javascript
详谈js对url进行编码和解码(三种方式的区别)
Aug 16 Javascript
微信小程序实现运动步数排行功能(可删除)
Jul 05 Javascript
JS加载解析Markdown文档过程详解
May 19 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
肝肠寸断了解下!盘点史上最伤心的十大动漫
2020/03/04 日漫
模拟xcopy的函数
2006/10/09 PHP
正则表达式语法
2006/10/09 Javascript
yii2整合百度编辑器umeditor及umeditor图片上传问题的解决办法
2016/04/20 PHP
PHP GD库相关图像生成和处理函数小结
2016/09/30 PHP
php post换行的方法
2020/02/03 PHP
js中传递特殊字符(+,&amp;)的方法
2014/01/16 Javascript
javascript中定义私有方法说明(private method)
2014/01/27 Javascript
Nodejs进程管理模块forever详解
2014/06/01 NodeJs
js获取当前页面的url网址信息
2014/06/12 Javascript
JS判断移动端访问设备并加载对应CSS样式
2014/06/13 Javascript
分享一则JavaScript滚动条插件源码
2015/03/03 Javascript
js实现完美兼容各大浏览器的人民币大小写相互转换
2015/10/29 Javascript
js实现简单的选项卡效果
2017/02/23 Javascript
jq.ajax+php+mysql实现关键字模糊查询(示例讲解)
2018/01/02 Javascript
实例详解ztree在vue项目中使用并且带有搜索功能
2018/08/24 Javascript
Vue 组件注册实例详解
2019/02/23 Javascript
浅谈Layui的eleTree树式选择器使用方法
2019/09/25 Javascript
全面了解python中的类,对象,方法,属性
2016/09/11 Python
新手常见6种的python报错及解决方法
2018/03/09 Python
解决python多行注释引发缩进错误的问题
2019/08/23 Python
python multiprocessing多进程变量共享与加锁的实现
2019/10/02 Python
django自定义模板标签过程解析
2019/12/14 Python
keras 特征图可视化实例(中间层)
2020/01/24 Python
PyQt5 界面显示无响应的实现
2020/03/26 Python
Python爬取微信小程序通用方法代码实例详解
2020/09/29 Python
使用CSS3和Checkbox实现JQuery的一些效果
2015/08/03 HTML / CSS
HTML5中视频音频的使用详解
2017/07/07 HTML / CSS
HTML5中图片之间的缝隙完美解决方法
2017/07/07 HTML / CSS
大学军训感想
2014/02/12 职场文书
《巨人的花园》教学反思
2014/02/12 职场文书
大学生职业生涯规划书汇总
2014/03/20 职场文书
实习生辞职信范文
2015/03/02 职场文书
暑假开始了,你的暑假学习计划写好了吗?
2019/07/04 职场文书
java解析XML详解
2021/07/09 Java/Android
JavaScript实现音乐播放器
2022/08/14 Javascript