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 相关文章推荐
js客户端快捷键管理类的较完整实现和应用
Jun 08 Javascript
js内置对象 学习笔记
Aug 01 Javascript
js 操作select和option常用代码整理
Dec 13 Javascript
javascript事件委托的方式绑定详解
Jun 10 Javascript
用canvas 实现个图片三角化(LOW POLY)效果
Feb 18 Javascript
解决jQuery ajax请求在IE6中莫名中断的问题
Jun 20 Javascript
js简单时间比较的方法
Aug 02 Javascript
javascript入门之string对象【新手必看】
Nov 22 Javascript
Node.js查找当前目录下文件夹实例代码
Mar 07 Javascript
node.js连接MongoDB数据库的2种方法教程
May 17 Javascript
详解基于Vue-cli搭建的项目如何和后台交互
Jun 29 Javascript
vue data有值,但是页面{{}} 取不到值的解决
Nov 09 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和XSS跨站攻击的防范
2007/04/17 PHP
PHP curl_setopt()函数实例代码与参数分析
2011/06/02 PHP
linux下为php添加iconv模块的方法
2016/02/28 PHP
Thinkphp5框架使用validate实现验证功能的方法
2019/08/27 PHP
用 JSON 处理缓存
2007/04/27 Javascript
IE6下出现JavaScript未结束的字符串常量错误的解决方法
2010/11/21 Javascript
谈一谈jQuery核心架构设计
2016/03/28 Javascript
javascript 删除数组元素和清空数组的简单方法
2017/02/24 Javascript
详解JavaScript调用栈、尾递归和手动优化
2017/06/03 Javascript
js学习总结_基于数据类型检测的四种方式(必看)
2017/07/04 Javascript
Vue的Class与Style绑定的方法
2017/09/01 Javascript
vue鼠标悬停事件实例详解
2019/04/01 Javascript
jquery实现商品sku多属性选择功能(商品详情页)
2019/12/20 jQuery
.netcore+vue 实现压缩文件下载功能
2020/09/24 Javascript
vue动态设置路由权限的主要思路
2021/01/13 Vue.js
python fabric实现远程操作和部署示例
2014/03/25 Python
python生成词云的实现方法(推荐)
2017/06/13 Python
基于python指定包的安装路径方法
2018/10/27 Python
python2与python3中关于对NaN类型数据的判断和转换方法
2018/10/30 Python
Python Django实现layui风格+django分页功能的例子
2019/08/29 Python
python中树与树的表示知识点总结
2019/09/14 Python
Python configparser模块操作代码实例
2020/06/08 Python
python使用多线程查询数据库的实现示例
2020/08/17 Python
python脚本第一行如何写
2020/08/30 Python
Anaconda详细安装步骤图文教程
2020/11/12 Python
python中用ggplot绘制画图实例讲解
2021/01/26 Python
Lululemon加拿大官网:加拿大知名体育服装零售商
2019/04/12 全球购物
荷兰家电销售网站:Welhof
2020/12/08 全球购物
大学生自荐信
2013/12/11 职场文书
企业财务总监岗位职责
2015/04/03 职场文书
民间借贷纠纷案件代理词
2015/05/26 职场文书
志愿者服务宣传标语口号
2015/12/26 职场文书
会计手工模拟做账心得体会
2016/01/22 职场文书
react中props 的使用及进行限制的方法
2021/04/28 Javascript
html输入两个数实现加减乘除功能
2021/07/01 HTML / CSS
基于HTML十秒做出淘宝页面
2021/10/24 HTML / CSS