JavaScript中判断为整数的多种方式及保留两位小数的方法


Posted in Javascript onSeptember 09, 2019

一、使用取余运算符判断

任何整数都会被1整除,即余数是0。利用这个规则来判断是否是整数。

function isInteger(obj) {
 return obj%1 === 0
}
isInteger(3) // true
isInteger(3.3) // false 

以上输出可以看出这个函数挺好用,但对于字符串和某些特殊值显得力不从心

isInteger('') // true
isInteger('3') // true
isInteger(true) // true
isInteger([]) // true

对于空字符串、字符串类型数字、布尔true、空数组都返回了true,真是难以接受。对这些类型的内部转换细节感兴趣的请参考:

因此,需要先 判断下对象是否是数字 ,比如加一个typeof

function isInteger(obj) {
 return typeof obj === 'number' && obj%1 === 0
}
isInteger('') // false
isInteger('3') // false
isInteger(true) // false
isInteger([]) // false

嗯,这样比较完美了。

二、使用Math.round、Math.ceil、Math.floor判断

整数取整后还是等于自己。利用这个特性来判断是否是整数,Math.floor示例,如下

function isInteger(obj) {
 return Math.floor(obj) === obj
}
isInteger(3) // true
isInteger(3.3) // false
isInteger('') // false
isInteger('3') // false
isInteger(true) // false
isInteger([]) // false

这个直接把字符串,true,[]屏蔽了,代码量比上一个函数还少。

三、通过parseInt判断

function isInteger(obj) {
 return parseInt(obj, 10) === obj
}
isInteger(3) // true
isInteger(3.3) // false
isInteger('') // false
isInteger('3') // false
isInteger(true) // false
isInteger([]) // false

很不错,但也有一个缺点

isInteger(1000000000000000000000) // false

竟然返回了false,没天理啊。原因是parseInt在解析整数之前强迫将第一个参数解析成字符串。这种方法将数字转换成整型不是一个好的选择。

四、通过位运算判断

function isInteger(obj) {
 return (obj | 0) === obj
}
isInteger(3) // true
isInteger(3.3) // false
isInteger('') // false
isInteger('3') // false
isInteger(true) // false
isInteger([]) // false

这个函数很不错,效率还很高。但有个缺陷,上文提到过,位运算只能处理32位以内的数字,对于超过32位的无能为力,如

isInteger(Math.pow(2, 32)) // 32位以上的数字返回false了

当然,多数时候我们不会用到那么大的数字。

五、ES6提供了Number.isInteger

Number.isInteger(3) // true
Number.isInteger(3.1) // false
Number.isInteger('') // false
Number.isInteger('3') // false
Number.isInteger(true) // false
Number.isInteger([]) // false

目前,最新的 Firefox 和Chrome已经支持。

六、js 输入int类型数字后自动在后面加.00

var getFloatStr = function (num) {
 num += '';
 num = num.replace(/[^0-9|\.]/g, ''); //清除字符串中的非数字非.字符
 if (/^0+/) //清除字符串开头的0
  num = num.replace(/^0+/, '');
 if (!/\./.test(num)) //为整数字符串在末尾添加.00
  num += '.00';
 if (/^\./.test(num)) //字符以.开头时,在开头添加0
  num = '0' + num;
 num += '00'; //在字符串末尾补零
 num = num.match(/\d+\.\d{2}/)[0];
 return num;
 };

如若vue 全局使用 在 main.js

Vue.prototype.getFloatStr = function(num) {
 num += '';
 num = num.replace(/[^0-9|\.]/g, ''); //清除字符串中的非数字非.字符

 if (/^0+/) //清除字符串开头的0
 num = num.replace(/^0+/, '');
 if (!/\./.test(num)) //为整数字符串在末尾添加.00
 num += '.00';
 if (/^\./.test(num)) //字符以.开头时,在开头添加0
 num = '0' + num;
 num += '00'; //在字符串末尾补零
 num = num.match(/\d+\.\d{2}/)[0];
 return num;
}

方法有很多种 例如:

js将小数转为保留两位小数(保留0.00和不保留)

function toDecimal2(x) {
 var f = Math.round(x * 100) / 100;
 var s = f.toString();
 var rs = s.indexOf('.');
 if (rs < 0) {
 rs = s.length;
 s += '.';
 }
 while (s.length <= rs + 2) {
 s += '0';
 }
 return s;
}
//保留2位小数,如:2,还会保留2 不会补0
function toDecimal2NoZero(x) {
 var f = Math.round(x * 100) / 100;
 var s = f.toString();
 return s;
}

总结

以上所述是小编给大家介绍的JavaScript中判断为整数的多种方式及保留两位小数,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
让插入到 innerHTML 中的 script 跑起来的实现代码
Jul 01 Javascript
JScript中的&quot;this&quot;关键字使用方式补充材料
Mar 08 Javascript
jQuery中校验时间格式的正则表达式小结
Sep 22 Javascript
基于JavaScript实现动态创建表格和增加表格行数
Dec 20 Javascript
Bootstrap 设置datetimepicker在屏幕上面弹出设置方法
Mar 21 Javascript
vue实现todolist基本功能以及数据存储功能实例详解
Apr 11 Javascript
vue+高德地图写地图选址组件的方法
May 18 Javascript
VUE 解决mode为history页面为空白的问题
Nov 01 Javascript
使用React代码动态生成栅格布局的方法
May 24 Javascript
快速解决element的autofocus失效问题
Sep 08 Javascript
JavaScript实现简易计算器小功能
Oct 22 Javascript
解决vue-router的beforeRouteUpdate不能触发
Apr 14 Vue.js
javascript删除数组元素的七个方法示例
Sep 09 #Javascript
微信小程序 select 下拉框组件功能
Sep 09 #Javascript
移动端手指操控左右滑动的菜单
Sep 08 #Javascript
swiper Scrollbar滚动条组件详解
Sep 08 #Javascript
js实现移动端tab切换时下划线滑动效果
Sep 08 #Javascript
swiper4实现移动端导航切换
Oct 16 #Javascript
Swiper.js实现移动端元素左右滑动
Sep 08 #Javascript
You might like
js 获取屏幕各种宽高的方法(浏览器兼容)
2013/05/15 Javascript
IE中的File域无法清空使用jQuery重设File域
2014/04/24 Javascript
深入浅析Bootstrap列表组组件
2016/05/03 Javascript
js HTML5多图片上传及预览实例解析(不含前端的文件分割)
2016/08/26 Javascript
Bootstrap在线电子商务网站实战项目5
2016/10/14 Javascript
JavaScript ES6中CLASS的使用详解
2016/11/22 Javascript
利用jQuery插件imgAreaSelect实现图片上传裁剪(同步显示图像位置信息)
2016/12/02 Javascript
详解Angular的双向数据绑定(MV-VM)
2016/12/26 Javascript
实例解析js中try、catch、finally的执行规则
2017/02/24 Javascript
NodeJS、NPM安装配置步骤(windows版本) 以及环境变量详解
2017/05/13 NodeJs
Nuxt.js实现校验访问浏览器类型的中间件
2018/08/24 Javascript
详解webpack打包时排除其中一个css、js文件或单独打包一个css、js文件(两种方法)
2018/10/26 Javascript
jQuery模拟html下拉多选框的原生实现方法示例
2019/05/30 jQuery
微信小程序tab左右滑动切换功能的实现代码
2021/02/08 Javascript
[01:02]DOTA2上海特锦赛SHOWOPEN
2016/03/25 DOTA
在漏洞利用Python代码真的很爽
2007/08/26 Python
Python文件操作类操作实例详解
2014/07/11 Python
浅析Python中的join()方法的使用
2015/05/19 Python
Python编程中用close()方法关闭文件的教程
2015/05/24 Python
python脚本设置系统时间的两种方法
2016/02/21 Python
python模拟Django框架实例
2016/05/17 Python
Python中装饰器高级用法详解
2017/12/25 Python
python正则表达式面试题解答
2020/04/28 Python
Python使用sax模块解析XML文件示例
2019/04/04 Python
python实现五子棋人机对战游戏
2020/03/25 Python
pandas 数据结构之Series的使用方法
2019/06/21 Python
详解使用HTML5的classList属性操作CSS类
2017/10/13 HTML / CSS
微信浏览器取消缓存的方法
2015/03/28 HTML / CSS
HTML5中的websocket实现直播功能
2018/05/21 HTML / CSS
科茨沃尔德家居商店:Scotts of Stow
2018/06/29 全球购物
手工制作的男士奢华英国鞋和服装之家:Goodwin Smith
2019/06/21 全球购物
Vision Direct比利时:在线订购隐形眼镜
2019/08/27 全球购物
北京天润融通.net面试题笔试题
2012/02/20 面试题
人事专员职责
2014/02/22 职场文书
少儿节目主持串词
2014/04/02 职场文书
小学生勤俭节约倡议书
2015/04/29 职场文书