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 相关文章推荐
uploadify 3.0 详细使用说明
Jun 18 Javascript
利用百度地图JSAPI生成h7n9禽流感分布图实现代码
Apr 15 Javascript
JavaScript中的substr()方法使用详解
Jun 06 Javascript
js闭包所用的场合以及优缺点分析
Jun 22 Javascript
ajax如何实现页面局部跳转与结果返回
Aug 24 Javascript
jquery实现图片上传前本地预览功能
May 10 Javascript
jQuery简单倒计时效果完整示例
Sep 20 Javascript
react-router实现跳转传值的方法示例
May 27 Javascript
vue+vuex+axios实现登录、注册页权限拦截
Mar 09 Javascript
Webpack打包字体font-awesome的方法示例
Apr 26 Javascript
ES6中定义类和对象的方法示例
Jul 31 Javascript
vue-router的钩子函数用法实例分析
Oct 26 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
PHP is_subclass_of函数的一个BUG和解决方法
2014/06/01 PHP
PHP中执行cmd命令的方法
2014/10/11 PHP
ThinkPHP路由机制简介
2016/03/23 PHP
Laravel 6.2 中添加了可调用容器对象的方法
2019/10/22 PHP
js文本框输入点回车触发确定兼容IE、FF等
2013/11/19 Javascript
display和visibility的区别示例介绍
2014/02/26 Javascript
JavaScript中使用Callback控制流程介绍
2015/03/16 Javascript
让DIV的滚动条自动滚动到最底部的3种方法(推荐)
2016/09/24 Javascript
React实现点击删除列表中对应项
2017/01/10 Javascript
微信公众号菜单配置微信小程序实例详解
2017/03/31 Javascript
激动人心的 Angular HttpClient的源码解析
2017/07/10 Javascript
Vue2.0 slot分发内容与props验证的方法
2017/12/12 Javascript
React 高阶组件入门介绍
2018/01/11 Javascript
微信小程序实现蒙版弹窗效果
2018/11/01 Javascript
js防抖和节流的深入讲解
2018/12/06 Javascript
浅谈Vue服务端渲染框架Nuxt的那些事
2018/12/21 Javascript
用Fundebug插件记录网络请求异常的方法
2019/02/21 Javascript
Javascript Worker子线程代码实例
2020/02/20 Javascript
javascript实现前端成语点击验证
2020/06/24 Javascript
vue 避免变量赋值后双向绑定的操作
2020/11/07 Javascript
[06:48]DOTA2-DPC中国联赛2月26日Recap集锦
2021/03/11 DOTA
Python全局变量操作详解
2015/04/14 Python
部署Python的框架下的web app的详细教程
2015/04/30 Python
深入解析Python中的WSGI接口
2015/05/11 Python
python 采集中文乱码问题的完美解决方法
2016/09/27 Python
django的登录注册系统的示例代码
2018/05/14 Python
Python pymongo模块常用操作分析
2018/09/01 Python
python数据批量写入ScrolledText的优化方法
2018/10/11 Python
Django REST framework 视图和路由详解
2019/07/19 Python
python实现经纬度采样的示例代码
2020/12/10 Python
Spartoo芬兰:欧洲最大的网上鞋店
2016/08/28 全球购物
英国女士家居服网站:hush
2017/08/09 全球购物
100%法国制造的游戏和玩具:Les Jouets Français
2021/03/02 全球购物
水污染治理专业毕业生推荐信
2013/11/14 职场文书
升学宴来宾致辞
2015/07/27 职场文书
解决tk mapper 通用mapper的bug问题
2021/06/16 Java/Android