JavaScript 中判断变量是否为数字的示例代码


Posted in Javascript onOctober 22, 2020

简介

JavaScript 是一种动态类型语言,这意味着解释器在运行时确定变量的类型。实际上,这也允许我们在相同的代码中使用相同的变量来存储不同类型的数据。如果没有文档和一致性,我们在使用代码时并不总是知道变量的类型。

JavaScript 中判断变量是否为数字的示例代码

当我们期望一个变量是数字时,对字符串或数组进行操作可能会在代码中导致奇怪的结果。在本文中,我们将会介绍一些判断变量是否为数字的函数。

像"10"之类的数字的字符串不应被接受。在JavaScript中,诸如NaN,Infinity和-Infinity之类的特殊值也是数字类型的。

根据这些要求,最好使用的函数是内置Number对象中的isFinite()函数。但是,开发人员通常会使用其他函数,如Number.isNaN()和typeof()函数。

我们先创建一些变量:

let intVar = 2; 
let floatVar = 10.5; 
let stringVar = '4'; 
let nanVar = NaN; 
let infinityVar = Infinity; 
let nullVar = null; 
let undefinedVar = undefined;

使用 Number.isFinite() 函数名

Number.isFinite()函数检查变量是否为数字,还检查其是否为有限值。因此,对于NaN,Infinity或-Infinity的数字,它返回false。

我们用上面定义的变量来检验一下:

> Number.isFinite(intVar); 
true 
> Number.isFinite(floatVar); 
true 
> Number.isFinite(stringVar); 
false 
> Number.isFinite(nanVar); 
false 
> Number.isFinite(infinityVar); 
false 
> Number.isFinite(nullVar); 
false 
> Number.isFinite(undefined); 
false

这正是我们想要的。特殊的非有限数以及非数字类型的任何变量都会被忽略。所以,如果你想检查一个变量是否是一个数字,最好的方法是使用Number.isFinite()函数。

使用 Number.isNaN() 方法

标准Number对象有一个isNaN()方法。它接受一个参数,并确定其值是否为NaN。因为我们想检查一个变量是否是一个数字,所以我们将在检查中使用非操作符!。

> !Number.isNaN(intVar); 
true 
> !Number.isNaN(floatVar); 
true 
> !Number.isNaN(stringVar); 
true # Wrong 
> !Number.isNaN(nanVar); 
false 
> !Number.isNaN(infinityVar); 
true # Wrong 
> !Number.isNaN(nullVar); 
true # Wrong 
> !Number.isNaN(undefinedVar); 
true # Wrong

这个方法是相当宽松的,因为它接受根本不是数字的值。这种方法最适合于当你知道你有一个数字并且要检查它是否是一个NaN值时,而不是一般的数字检查。

使用 typeof() 方法

typeof()函数是一个全局函数,它接受变量或值作为参数,并返回其类型的字符串表示。JavaScript 总共有9种类型

  • undefined
  • boolean
  • number
  • string
  • bigint
  • symbol
  • object
  • null (typeof() 显示的是 object)
  • function (一种特殊类型的 object)

为了验证变量是否为数字,我们只需要检查typeof()返回的值是否为`"number"。让我们尝试一下测试变量:

> typeof(intVar) == 'number'; 
true 
> typeof(floatVar) == 'number'; 
true 
> typeof(stringVar) == 'number'; 
false 
> typeof(nanVar) == 'number'; 
true # Wrong 
> typeof(infinityVar) == 'number'; 
true # Wrong 
> typeof(nullVar) == 'number'; 
false 
> typeof(undefined) == 'number'; 
false

typeof()函数的性能比Number.isNaN()要好得多。它正确地确定了字符串变量null和undefined不是数字。但是,对于NaN和Infinity,它返回true。

尽管从技术上来说这是正确的结果,但NaN和Infinity是特殊的数字值,对于大多数使用情况,我们宁愿忽略它们。

总结

在本文中,我们学习了如何检查JavaScript中的变量是否为数字。Number.isNaN()函数仅在我们知道变量为数字并且需要验证它是否为NaN`时才适用。

如果代码中有NaN,Infinity或-Infinity以及其他数字,则 typeof()`函数适用。

Number.isFinite()方法捕获所有有限数,是最适合我们的要求。

到此这篇关于JavaScript 中判断变量是否为数字的示例代码的文章就介绍到这了,更多相关js判断变量为数字内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
IE8下String的Trim()方法失效的解决方法
Nov 08 Javascript
jQuery表格插件datatables用法总结
Sep 05 Javascript
jQuery简单实现禁用右键菜单
Mar 10 Javascript
JS获取及设置TextArea或input文本框选择文本位置的方法
Mar 24 Javascript
实现JavaScript高性能的数据存储
Dec 11 Javascript
通过fastclick源码分析彻底解决tap“点透”
Dec 24 Javascript
vue组件传递对象中实现单向绑定的示例
Feb 28 Javascript
vue 组件的封装之基于axios的ajax请求方法
Aug 11 Javascript
JavaScript使用递归和循环实现阶乘的实例代码
Aug 28 Javascript
Javascript通过控制类名更改样式
May 24 Javascript
如何使用CSS3+JQuery实现悬浮墙式菜单
Jun 18 jQuery
Vue v-for中的 input 或 select的值发生改变时触发事件操作
Aug 31 Javascript
关于vue属性使用和不使用冒号的区别说明
Oct 22 #Javascript
jquery实现抽奖功能
Oct 22 #jQuery
Vue实现简单的留言板
Oct 23 #Javascript
Vue+Bootstrap收藏(点赞)功能逻辑与具体实现
Oct 22 #Javascript
JavaScript实现简易计算器小功能
Oct 22 #Javascript
vue实现简单加法计算器
Oct 22 #Javascript
微信小程序实现选项卡滑动切换
Oct 22 #Javascript
You might like
收集的DedeCMS一些使用经验
2007/03/17 PHP
PHP常用特殊运算符号和函数总结(php新手入门必看)
2013/02/02 PHP
phpStudy访问速度慢和启动失败的解决办法
2015/11/19 PHP
php array_multisort 对数组进行排序详解及实例代码
2016/10/27 PHP
thinkPHP中配置的读取与C方法详解
2016/12/05 PHP
基于PHP实现堆排序原理及实例详解
2020/06/19 PHP
很全的显示阴历(农历)日期的js代码
2009/01/01 Javascript
JavaScript 无符号右移运算符
2009/04/17 Javascript
JavaScript判断一个URL链接是否有效的实现方法
2011/10/08 Javascript
Jquery图片滚动与幻灯片的实例代码
2013/04/08 Javascript
用js+iframe形成页面的一种遮罩效果的具体实现
2013/12/31 Javascript
javascript电商网站抢购倒计时效果实现
2015/11/19 Javascript
node-http-proxy修改响应结果实例代码
2016/06/06 Javascript
Node.js环境下JavaScript实现单链表与双链表结构
2016/06/12 Javascript
javascript 利用arguments实现可变长参数
2016/11/21 Javascript
JavaScript实现三级联动菜单实例代码
2017/06/26 Javascript
JavaScript设计模式之调停者模式实例详解
2018/02/03 Javascript
vue+高德地图实现地图搜索及点击定位操作
2020/09/09 Javascript
python通过colorama模块在控制台输出彩色文字的方法
2015/03/19 Python
python简单操作excle的方法
2018/09/12 Python
Python基本socket通信控制操作示例
2019/01/30 Python
详解pandas删除缺失数据(pd.dropna()方法)
2019/06/25 Python
Python使用指定端口进行http请求的例子
2019/07/25 Python
python字典的常用方法总结
2019/07/31 Python
python实现截取屏幕保存文件,删除N天前截图的例子
2019/08/27 Python
django 模版关闭转义方式
2020/05/14 Python
css3 pointer-events 介绍详解
2017/09/18 HTML / CSS
HTML5 Geolocation API的正确使用方法
2018/12/04 HTML / CSS
canvas像素点操作之视频绿幕抠图
2018/09/11 HTML / CSS
One.com挪威:北欧成长最快的网络托管公司
2016/11/19 全球购物
民政局个人整改措施
2014/09/24 职场文书
老兵退伍标语
2014/10/07 职场文书
开国大典观后感
2015/06/04 职场文书
《倍数和因数》教学反思
2016/02/23 职场文书
详解JAVA中的OPTIONAL
2021/06/14 Java/Android
TV动画《八十龟酱观察日记》第四季宣传PV公布
2022/04/06 日漫