关于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 相关文章推荐
JS 字符串连接[性能比较]
May 10 Javascript
JavaScript 获取用户客户端操作系统版本
Aug 25 Javascript
js 实现菜单上下显示附效果图
Nov 21 Javascript
jquery 淡入淡出效果的简单实现
Feb 07 Javascript
使用jsonp完美解决跨域问题
Nov 27 Javascript
jQuery实现的鼠标经过时变宽的效果(附demo源码)
Apr 28 Javascript
javascript基本数据类型及类型检测常用方法小结
Dec 14 Javascript
JavaScript使用atan2来绘制箭头和曲线的实例
Sep 14 Javascript
javascript中的event loop事件循环详解
Dec 14 Javascript
JavaScript实现图片放大镜效果
Jun 27 Javascript
小程序中的箭头函数的具体使用
Jun 19 Javascript
原生js+css实现tab切换功能
Sep 17 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
pdo中使用参数化查询sql
2011/08/11 PHP
PHP+Ajax检测用户名或邮件注册时是否已经存在实例教程
2014/08/23 PHP
PHP 数组基本操作小结(推荐)
2016/06/13 PHP
php实现微信支付之现金红包
2018/05/30 PHP
PHP读取目录树的实现方法分析
2019/03/22 PHP
SharePoint 客户端对象模型 (一) ECMA Script
2011/05/22 Javascript
jquery与prototype框架的详细对比
2013/11/21 Javascript
javascript实现checkbox复选框实例代码
2016/01/10 Javascript
JavaScript禁止复制与粘贴的实现代码
2016/05/16 Javascript
jQuery实现对无序列表的排序功能(附demo源码下载)
2016/06/25 Javascript
express文件上传中间件Multer详解
2016/10/24 Javascript
easyui messager alert 三秒后自动关闭提示的实例
2016/11/07 Javascript
jquery实现左右轮播图效果
2017/09/28 jQuery
微信小程序使用radio显示单选项功能【附源码下载】
2017/12/11 Javascript
JavaScript模块详解
2017/12/18 Javascript
Vue服务器渲染Nuxt学习笔记
2018/01/31 Javascript
浅谈Vue2.0中v-for迭代语法的变化(key、index)
2018/03/06 Javascript
vue无限轮播插件代码实例
2019/05/10 Javascript
vue中使用带隐藏文本信息的图片、图片水印的方法
2020/04/24 Javascript
如何通过vscode运行调试javascript代码
2020/07/24 Javascript
Vue的v-model的几种修饰符.lazy,.number和.trim的用法说明
2020/08/05 Javascript
VUE使用 wx-open-launch-app 组件开发微信打开APP功能
2020/08/11 Javascript
python之cv2与图像的载入、显示和保存实例
2018/12/05 Python
CSS3 倾斜的网页图片库实例教程
2009/11/14 HTML / CSS
详解Html5 监听拦截Android返回键方法
2018/04/18 HTML / CSS
Calzedonia美国官网:意大利风格袜子、打底裤和沙滩装
2018/07/19 全球购物
英国国家美术馆商店:National Gallery
2019/05/01 全球购物
现代化办公人员工作的自我评价
2013/10/16 职场文书
大学生物业管理求职信
2013/10/24 职场文书
应届生财务会计求职信
2013/11/05 职场文书
冰淇淋店创业计划书范文
2013/12/27 职场文书
给客户的道歉信
2014/01/13 职场文书
房地产推广策划方案
2014/05/19 职场文书
合伙购房协议样本
2014/10/06 职场文书
2016幼儿教师自荐信范文
2016/01/28 职场文书
MySQL Shell import_table数据导入的实现
2021/08/07 MySQL