JavaScript如何实现对数字保留两位小数一位自动补零


Posted in Javascript onDecember 18, 2015

本章节介绍一下如何实现对数字保留两位小数效果,如果数字的原本小数位数不到两位,那么缺少的就自动补零,这个也是为了统一的效果,先看代码实例:

function returnFloat(value){
 var value=Math.round(parseFloat(value)*100)/100;
 var xsd=value.toString().split(".");
 if(xsd.length==1){
 value=value.toString()+".00";
 return value;
 }
 if(xsd.length>1){
 if(xsd[1].length<2){
 value=value.toString()+"0";
 }
 return value;
 }
}
var num=3.1;
console.log(returnFloat(num));

上面的代码实现了我们的要求,下面介绍一下它的实现过程。

一.代码注释:

1.function returnFloat(value){},参数是要被转换的数字。

2.var value=Math.round(parseFloat(value)*100)/100,这个应该是函数的核心之处,parseFloat(value)将参数转换为浮点数,因为参数有可能是字符串,乘以100是因为要保留两位小数,先将小数点向右移动两个位数,然后再利用Math.round()方法实行四舍五入计算,最后除以100,这样就实现了保留保留两位小数,并且还具有四舍五入效果,但是这个并不完美,如果参数数字本身的小数位数大于等于2是可以的,如3.1415,但是如3或者3.0这样的还是没有完美的实现,继续看下面。

3.var xsd=value.toString().split("."),使用点"."value分隔成一个数组。

4.if(xsd.length==1){value=value.toString()+".00";return value;},如果数组的长度是1,也就是说不存在小数,那么就会为这个数字添加两个0,例如3会被转换成3.00。

5.

if(xsd.length>1){
 if(xsd[1].length<2){
 value=value.toString()+"0";
 }
 return value;
 }

if(xsd.length>1)用来判断数字的长度是否大于1,也就是数字是否具有小数,如有小数,但是小数的位数小于2,也就是类似3.1这样的,就会在后面加一个0,也就是会转换为3.10。

二.相关学习教程:

1.Math.round()可以参阅javascript的Math.round()方法一章节。

2.parseFloat()函数可以参阅javascript的parseFloat()方法一章节。

3.toString()函数可以参阅javascript的Number对象的toString()方法一章节。 

4.split()函数可以参阅javascript的String对象的split()方法一章节。

Javascript 相关文章推荐
javascript静态的url如何传递
May 03 Javascript
JQuery 无废话系列教程(二) jquery实战篇上
Jun 23 Javascript
javascript 拖动表格行实现代码
May 05 Javascript
JS中判断null的方法分析
Nov 21 Javascript
Bootstrap Tooltip显示换行和左对齐的解决方案
Oct 11 Javascript
搭建element-ui的Vue前端工程操作实例
Feb 23 Javascript
5分钟学会Vue动画效果(小结)
Jul 21 Javascript
最简单的JS实现json转csv的方法
Jan 10 Javascript
Vue项目使用localStorage+Vuex保存用户登录信息
May 27 Javascript
小程序实现分类页
Jul 12 Javascript
微信小程序wx.request的简单封装
Nov 13 Javascript
在vue中使用cookie记住用户上次选择的实例(本次例子中为下拉框)
Sep 11 Javascript
js格式化时间的方法
Dec 18 #Javascript
谈谈我对JavaScript DOM事件的理解
Dec 18 #Javascript
JavaScript中字符串与Unicode编码互相转换的实现方法
Dec 18 #Javascript
jQuery Validation PlugIn的使用方法详解
Dec 18 #Javascript
最简单的JavaScript图片轮播代码(两种方法)
Dec 18 #Javascript
JS弹出对话框实现方法(三种方式)
Dec 18 #Javascript
jQuery Validate表单验证深入学习
Dec 18 #Javascript
You might like
谨慎使用PHP的引用原因分析
2012/09/06 PHP
使用HMAC-SHA1签名方法详解
2013/06/26 PHP
php字符串按照单词进行反转的方法
2015/03/14 PHP
PHP序列化操作方法分析
2016/09/28 PHP
php实现微信公众号企业转账功能
2018/10/01 PHP
在 Laravel 项目中使用 webpack-encore的方法
2019/07/21 PHP
PHP单文件上传原理及上传函数的封装操作示例
2019/09/02 PHP
javascript奇异的arguments分析
2010/10/20 Javascript
silverlight线程与基于事件驱动javascript引擎(实现轨迹回放功能)
2011/08/09 Javascript
利用window.name实现windowStorage代码分享
2014/01/02 Javascript
js实现仿百度风云榜可重复多次调用的TAB切换选项卡效果
2015/08/31 Javascript
详解Javascript事件驱动编程
2016/01/03 Javascript
利用Bootstrap实现表格复选框checkbox全选
2016/12/21 Javascript
微信小程序 省市区选择器实例详解(附源码下载)
2017/01/05 Javascript
jQuery实现获取选中复选框的值实例详解
2018/06/28 jQuery
nodejs 如何手动实现服务器
2018/08/20 NodeJs
javascript实现移动端红包雨页面
2020/06/23 Javascript
[47:45]DOTA2-DPC中国联赛 正赛 Phoenix vs Dragon BO3 第一场 2月26日
2021/03/11 DOTA
对python添加模块路径的三种方法总结
2018/10/16 Python
python实现根据指定字符截取对应的行的内容方法
2018/10/23 Python
python绘制中国大陆人口热力图
2018/11/07 Python
python的常用模块之collections模块详解
2018/12/06 Python
Python图像处理之直线和曲线的拟合与绘制【curve_fit()应用】
2018/12/26 Python
python-tkinter之按钮的使用,开关方法
2019/06/11 Python
face++与python实现人脸识别签到(考勤)功能
2019/08/28 Python
python用quad、dblquad实现一维二维积分的实例详解
2019/11/20 Python
Python使用matplotlib绘制Logistic曲线操作示例
2019/11/28 Python
Python3自定义json逐层解析器代码
2020/05/11 Python
移动端html5 meta标签的神奇功效
2016/01/06 HTML / CSS
Java文件和目录(IO)操作
2014/08/26 面试题
军训教官感言
2014/03/02 职场文书
四下基层实施方案
2014/03/28 职场文书
小学大队委竞选口号
2015/12/25 职场文书
巾帼建功标兵先进事迹材料
2016/02/29 职场文书
nginx反向代理时如何保持长连接
2021/03/31 Servers
python爬虫框架feapde的使用简介
2021/04/20 Python