JavaScript判断输入值是否为正整数(判断变量为数字)

更新时间：2023年11月10日 11:51:24 作者：历史老师-

在项目开发中,有时候需要使用JavaScript验证用户输入的是否为正整数,这篇文章主要给大家介绍了关于JavaScript判断输入值是否为正整数(判断变量为数字)的相关资料,需要的朋友可以参考下,

1.JS中的test是原来是JS中检测字符串中是否存在的一种模式，JS输入值是否为判断正整数代码：

<script type=”text/javascript”> 
　　function test() { 
　　　　var num = document.getElementById(“num”).value; 
　　　　if (num==”") { 
　　　　　　alert(‘请输入内容'); 
　　　　　　return false; 
　　　　} 
　　　　if (!(/(^[1-9]\d*$)/.test(num))) { 
　　　　　　alert(‘输入的不是正整数'); 
　　　　　　return false; 
　　　　}else { 
　　　　　　alert(‘输入的是正整数'); 
　　　　} 
　　} 
</script> 

<html> 
<body> 
<input type=”text” id=”num” /> 
<input type=”button” value=”测试” οnclick=”return test()” /> 
</body> 
</html>

扩展：

附判断数字、浮点的正则表达：

”^\\d+$” //非负整数（正整数 + 0）
“^[0-9]*[1-9][0-9]*$” //正整数
“^((-\\d+)|(0+))$” //非正整数（负整数 + 0）
“^-[0-9]*[1-9][0-9]*$” //负整数
“^-?\\d+$” //整数
“^\\d+(\\.\\d+)?$” //非负浮点数（正浮点数 + 0）
“^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$” //正浮点数
“^((-\\d+(\\.\\d+)?)|(0+(\\.0+)?))$” //非正浮点数（负浮点数 + 0）
“^(-?\\d+)(\\.\\d+)?$” //浮点数

2.使用 jQuery

使用 jQuery 库，您可以使用 $.isNumeric() 方法，它确定传递的值是否代表一个有效的数值。如果值是 number 或 string 类型并且可以强制转换为有限数，则返回 true。

const { JSDOM } = require("jsdom");
const { window } = new JSDOM();
var $ = require("jquery")(window);
 
const isNumber = n => $.isNumeric(n);
 
isNumber(1);                // true
isNumber(0);                // true
isNumber(-1);               // true
 
isNumber(new Number(1));    // true
 
isNumber(1.0);              // true
isNumber(1.1);              // true
isNumber(Math.PI);          // true
 
isNumber('1');              // true
isNumber('string');         // false
 
isNumber(NaN);              // false
isNumber(Infinity);         // false
isNumber(-Infinity);        // false
 
isNumber(true);             // false
isNumber(undefined)         // false
isNumber([1]);              // false

3. 使用 typeof 操作符

在纯 JavaScript 中，您可以使用 typeof 运算符，它返回一个指示操作数类型的字符串。您可以将其与严格的相等运算符一起使用，以检查原始数值。此外，要检查 Number 对象也是如此，您可以使用 instanceof 运算符，如下

const isNumber = n => (typeof(n) === 'number' || n instanceof Number);
 
isNumber(new Number(1));    // true
isNumber(0);                // true
isNumber(-1);               // true
 
isNumber(new Number(1));    // true
 
isNumber(1.0);              // true
isNumber(1.1);              // true
isNumber(Math.PI);          // true
                    
isNumber('1');              // false
isNumber('string');         // false
                    
isNumber(NaN);              // true
isNumber(Infinity);         // true
isNumber(-Infinity);        // true
                    
isNumber(true);             // false
isNumber(undefined);        // false
isNumber([1]);              // false

上述解决方案返回 true +Infinity, -Infinity，和 NaN (不是数字)。此外，它不适用于可以强制转换为有限数字的字符串。要处理此问题，请添加一些附加条件 isFinite() 和 isNaN() 方法。

const isNumber = n => (typeof(n) === 'number' || n instanceof Number ||
                    (typeof(n) === 'string' && !isNaN(n))) &&
                    isFinite(n);
 
isNumber(1);                // true
isNumber(0);                // true
isNumber(-1);               // true
 
isNumber(new Number(1));    // true
 
isNumber(1.0);              // true
isNumber(1.1);              // true
isNumber(Math.PI);          // true
                        
isNumber('1');              // true
isNumber('string');         // false
                        
isNumber(NaN);              // false
isNumber(Infinity);         // false
isNumber(-Infinity);        // false
                        
isNumber(true);             // false
isNumber(undefined);        // false
isNumber([1]);              // false

4. 使用一元加

最后，您可以检查数值一元加号 (+) 运算符，如下图：

const isNumber = n => (n === +n);
 
isNumber(1);                // true
isNumber(0);                // true
isNumber(-1);               // true
 
isNumber(new Number(1));    // false
 
isNumber(1.0);              // true
isNumber(1.1);              // true
isNumber(Math.PI);          // true
                            
isNumber('1');              // false
isNumber('string');         // false
                            
isNumber(NaN);              // false
isNumber(Infinity);         // true
isNumber(-Infinity);        // true
                            
isNumber(true);             // false
isNumber(undefined);        // false
isNumber([1]);              // false

请注意，这不适用于 Number 反对，并考虑 +Infinity 和 -Infinity 作为数字。此外，它不处理可以强制转换为有限数字的字符串。这些可以以与之前的解决方案相同的方式处理。

5.使用isNaN()函数

isNaN()的缺点就在于 null、空格以及空串会被按照0来处理

NaN: Not a Number

/**
*判断是否是数字
*
**/
function isRealNum(val){
    // isNaN()函数 把空串 空格 以及NUll 按照0来处理 所以先去除
    // if(val === "" || val ==null){
        // return false;
    //}
//或者 直接判断  前提是要将值转为number类型
 if(typeof val !== 'number'){
     return false;
   }else{
 if(!isNaN(val)){
        return true;
    }else{
        return false;
    }
}
}

6.使用正则表达式　

/**
* 校验只要是数字（包含正负整数，0以及正负浮点数）就返回true
**/
function isNumber(val){
    var regPos = /^\d+(\.\d+)?$/; //非负浮点数
    var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; //负浮点数
    if(regPos.test(val) || regNeg.test(val)){
        return true;
    }else{
        return false;
    }
}
/**
* 校验正负正数就返回true
**/
function isIntNum(val){
    var regPos = / ^\d+$/; // 非负整数
    var regNeg = /^\-[1-9][0-9]*$/; // 负整数
    if(regPos.test(val) || regNeg.test(val)){
        return true;
    }else{
        return false;
    }
}

总结

到此这篇关于JavaScript判断输入值是否为正整数的文章就介绍到这了,更多相关JS判断输入值为正整数内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

浅析Bootstrap验证控件的使用
这篇文章主要介绍了浅析Bootstrap验证控件的使用的相关资料,非常不错具有参考借鉴价值，需要的朋友可以参考下
2016-06-06
js实现带有动画的返回顶部
这篇文章主要为大家详细介绍了js实现带有动画的返回顶部，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-08-08
js实现带有介绍的Select列表菜单实例
这篇文章主要介绍了js实现带有介绍的Select列表菜单,涉及javascript页面元素的动态操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-08-08
JS结合WebSocket实现实时双向通信
WebSocket 是一种在 Web 应用程序中实现实时、双向通信的协议,在本文中,我们将深入介绍 WebSocket 的原理、用法以及一些实际应用场景,x需要的可以参考下
2023-11-11
input框中自动展示当前日期yyyy/mm/dd的实现方法
下面小编就为大家带来一篇input框中自动展示当前日期yyyy/mm/dd的实现方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-07-07
JS+CSS实现带小三角指引的滑动门效果
这篇文章主要介绍了JS+CSS实现带小三角指引的滑动门效果,可实现带有箭头提示效果的滑动门功能,涉及JavaScript动态操作页面元素样式的相关技巧,需要的朋友可以参考下
2015-09-09
Bootstrap提示框效果的实例代码
本篇文章主要介绍了Bootstrap提示框效果的实例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-07-07
解决layui动态加载复选框无法选中的问题
今天小编就为大家分享一篇解决layui动态加载复选框无法选中的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-09-09
JavaScript对数字的判断与处理实例分析
这篇文章主要介绍了JavaScript对数字的判断与处理方法,实例分析了javascript判断数字的常见方法与针对数字处理的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-02-02
多浏览器兼容的右下角广告代码（已测）
支持FIREFOX IE7 IE6 周未就为了这个小效果，折腾死人了！找了很多的代码都不行，不是不支持FIREFOX，就是对HTML和XHTML有要求！
2008-04-04