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 相关文章推荐
List Installed Hot Fixes
Jun 12 Javascript
JS获取select的value和text值的简单实例
Feb 26 Javascript
javascript实现数独解法
Mar 14 Javascript
深入学习AngularJS中数据的双向绑定机制
Mar 04 Javascript
JavaScript函数中关于valueOf和toString的理解
Jun 14 Javascript
jQuery简单实现页面元素置顶时悬浮效果示例
Aug 01 Javascript
js图片上传的封装代码
Aug 01 Javascript
详解如何在angular2中获取节点
Nov 23 Javascript
基于vue.js中事件修饰符.self的用法(详解)
Feb 23 Javascript
vue  自定义组件实现通讯录功能
Sep 30 Javascript
判断“命令按钮”是否被鼠标单击详解
Jul 31 Javascript
Vue 自定义指令功能完整实例
Sep 17 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中如何同时使用session和cookie来保存用户登录信息
2013/07/05 PHP
基于PHP的简单采集数据入库程序
2014/07/30 PHP
PHP中$this和$that指针使用实例
2015/01/06 PHP
php中使用GD库做验证码
2016/03/31 PHP
基于Swoole实现PHP与websocket聊天室
2016/08/03 PHP
PHP自定义多进制的方法
2016/11/03 PHP
JScript中使用ADODB.Stream判断文件编码的代码
2008/06/09 Javascript
Javascript hasOwnProperty 方法 &amp; in 关键字
2008/11/26 Javascript
javascript 同时在IE和FireFox获取KeyCode的代码
2010/02/07 Javascript
javascript sudoku 数独智力游戏生成代码
2010/03/27 Javascript
safari,opera嵌入iframe页面cookie读取问题解决方法
2010/06/23 Javascript
js匿名函数的调用示例(形式多种多样)
2014/08/20 Javascript
jQuery UI设置固定日期选择特效代码分享
2015/08/27 Javascript
jquery实现多次上传同一张图片
2017/01/09 Javascript
利用nodeJs anywhere搭建本地服务器环境的方法
2018/05/12 NodeJs
JavaScript函数、闭包、原型、面向对象学习笔记
2018/09/06 Javascript
利用原生JS实现欢乐水果机小游戏
2020/04/23 Javascript
基于VUE实现判断设备是PC还是移动端
2020/07/03 Javascript
python opencv之SURF算法示例
2018/02/24 Python
Python字符串的一些操作方法总结
2019/06/10 Python
Python:二维列表下标互换方式(矩阵转置)
2019/12/02 Python
keras实现VGG16方式(预测一张图片)
2020/07/07 Python
matplotlib设置颜色、标记、线条,让你的图像更加丰富(推荐)
2020/09/25 Python
HTML5中Canvas与SVG的画图原理比较
2013/01/16 HTML / CSS
Canvas环形饼图与手势控制的实现代码
2019/11/08 HTML / CSS
全球最大的房车租赁市场:Outdoorsy
2018/09/19 全球购物
Vans奥地利官方网站:美国原创极限运动潮牌
2018/09/30 全球购物
高尔夫球鞋、服装、手套和装备:FootJoy
2018/12/15 全球购物
书法比赛获奖感言
2014/02/10 职场文书
企业管理毕业生求职信范文
2014/03/07 职场文书
六一儿童节演讲稿
2014/05/23 职场文书
销售人员求职信
2014/07/22 职场文书
小学向国旗敬礼活动方案
2014/09/27 职场文书
居安思危观后感
2015/06/11 职场文书
2015暑假实习报告范文
2015/07/13 职场文书
看古人们是如何赞美老师的?
2019/07/08 职场文书