关于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 07 Javascript
javascript 函数及作用域总结介绍
Nov 12 Javascript
js 立即调用的函数表达式如何写
Jan 12 Javascript
JS将所有对象s的属性复制给对象r(原生js+jquery)
Jan 25 Javascript
HTML页面登录时的JS验证方法
May 28 Javascript
jQuery 重复加载错误以及修复方法
Dec 16 Javascript
jQuery动态添加
Apr 07 Javascript
jQuery四种选择器使用及示例
Jun 05 Javascript
js仿微信语音播放实现思路
Dec 12 Javascript
angularJs使用ng-repeat遍历后选中某一个的方法
Sep 30 Javascript
vue 中基于html5 drag drap的拖放效果案例分析
Nov 01 Javascript
详解webpack编译速度提升之DllPlugin
Feb 05 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
PHP中文乱码解决方案
2015/03/05 PHP
一个JS小玩意 几个属性相加不能超过一个特定值.
2009/09/29 Javascript
jQuery的end()方法使用详解
2015/07/15 Javascript
体验jQuery和AngularJS的不同点及AngularJS的迷人之处
2016/02/02 Javascript
AngularJS动态生成div的ID源码解析
2016/08/29 Javascript
使用Bootstrap + Vue.js实现添加删除数据示例
2017/02/27 Javascript
使用ionic(选项卡栏tab) icon(图标) ionic上拉菜单(ActionSheet) 实现通讯录界面切换实例代码
2017/10/20 Javascript
axios中cookie跨域及相关配置示例详解
2017/12/20 Javascript
Vue通过ref父子组件拿值方法
2018/09/12 Javascript
vue动画之点击按钮往上渐渐显示出来的实例
2018/09/29 Javascript
关于微信小程序map组件z-index的层级问题分析
2019/07/09 Javascript
python实现迭代法求方程组的根过程解析
2019/11/25 Javascript
webpack5 联邦模块介绍详解
2020/07/08 Javascript
Vue实现boradcast和dispatch的示例
2020/11/13 Javascript
[00:50]深扒TI7聊天轮盘语音出处6
2017/05/11 DOTA
Python挑选文件夹里宽大于300图片的方法
2015/03/05 Python
Python自动连接ssh的方法
2015/03/07 Python
python使用str &amp; repr转换字符串
2016/10/13 Python
Python GUI编程 文本弹窗的实例
2019/06/11 Python
PyCharm 解决找不到新打开项目的窗口问题
2021/01/15 Python
python使用Windows的wmic命令监控文件运行状况,如有异常发送邮件报警
2021/01/30 Python
Android本地应用打开方法——通过html5写连接
2016/03/11 HTML / CSS
HTML5注册页面示例代码
2014/03/27 HTML / CSS
FitFlop澳大利亚官网:英国符合人体工学的鞋类品牌
2017/06/05 全球购物
快时尚眼镜品牌,全国连锁眼镜店:LOHO眼镜生活
2018/10/08 全球购物
TOWER London官网:鞋子、靴子、运动鞋等
2019/07/14 全球购物
国际经济与贸易专业大学生职业规划书
2014/03/01 职场文书
《猴子种果树》教学反思
2014/04/26 职场文书
关于读书的演讲稿
2014/05/07 职场文书
物流专业自荐信
2014/05/23 职场文书
妇联领导班子剖析材料
2014/08/21 职场文书
禁毒宣传活动总结
2014/08/26 职场文书
党员干部反四风民主生活会对照检查材料思想汇报
2014/10/12 职场文书
邀请函怎么写
2015/01/30 职场文书
2016年全国助残日活动总结
2016/04/01 职场文书
详解Spring事件发布与监听机制
2021/06/30 Java/Android