javascript实现保留两位小数的多种方法


Posted in Javascript onDecember 18, 2015

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

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。

第二种方法:汇总JS中格式化数据保留两位小数的函数的多种方法

最好方法:

保留两位好像是这样吧   

var a = 9.39393; 
 alert(a.toFixed(2));

说明:

alert(Number.toFixed(9.39393));  
  返回的是9.39  
  但是只有ie5.5以上的版本才支持。

其它方法:

方法一:

function roundFun(numberRound,roundDigit) //四舍五入,保留位数为roundDigit 
 { 
 if (numberRound>=0) 
 { 
 var tempNumber = parseInt((numberRound * Math.pow(10,roundDigit)+0.5))/Math.pow(10,roundDigit); 
 return tempNumber; 
 } 
 else 
 { 
 numberRound1=-numberRound 
 var tempNumber = parseInt((numberRound1 * Math.pow(10,roundDigit)+0.5))/Math.pow(10,roundDigit); 
 return -tempNumber; 
 } 
  }

方法二:

<script> 
 tmp = "1234567.57232" 
 result = tmp.substr(0,tmp.indexOf(".")+3); 
 alert(result); 
 </script>

第三种方法:javascript保留两位小数代码

<script type="text/javascript"> 
 //保留两位小数 
 //功能:将浮点数四舍五入,取小数点后2位 
 function toDecimal(x) { 
  var f = parseFloat(x); 
  if (isNaN(f)) { 
  return; 
  } 
  f = Math.round(x*100)/100; 
  return f; 
 } 
 
 
 //制保留2位小数,如:2,会在2后面补上00.即2.00 
 function toDecimal2(x) { 
  var f = parseFloat(x); 
  if (isNaN(f)) { 
  return false; 
  } 
  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; 
 } 
  
 function fomatFloat(src,pos){ 
  return Math.round(src*Math.pow(10, pos))/Math.pow(10, pos); 
 } 
 //四舍五入 
 alert("保留2位小数:" + toDecimal(3.14159267)); 
 alert("强制保留2位小数:" + toDecimal2(3.14159267)); 
 alert("保留2位小数:" + toDecimal(3.14559267)); 
 alert("强制保留2位小数:" + toDecimal2(3.15159267)); 
 alert("保留2位小数:" + fomatFloat(3.14559267, 2)); 
 alert("保留1位小数:" + fomatFloat(3.15159267, 1)); 
  
 //五舍六入 
 alert("保留2位小数:" + 1000.003.toFixed(2)); 
 alert("保留1位小数:" + 1000.08.toFixed(1)); 
 alert("保留1位小数:" + 1000.04.toFixed(1)); 
 alert("保留1位小数:" + 1000.05.toFixed(1)); 
  
 //科学计数 
 alert(3.1415.toExponential(2)); 
 alert(3.1455.toExponential(2)); 
 alert(3.1445.toExponential(2)); 
 alert(3.1465.toExponential(2)); 
 alert(3.1665.toExponential(1)); 
 //精确到n位,不含n位 
 alert("精确到小数点第2位" + 3.1415.toPrecision(2)); 
 alert("精确到小数点第3位" + 3.1465.toPrecision(3)); 
 alert("精确到小数点第2位" + 3.1415.toPrecision(2)); 
 alert("精确到小数点第2位" + 3.1455.toPrecision(2)); 
 alert("精确到小数点第5位" + 3.141592679287.toPrecision(5)); 
 </script>

以上就是javascript实现保留两位小数的多种方法,希望对大家的学习有所帮助。

Javascript 相关文章推荐
node.js中的fs.appendFileSync方法使用说明
Dec 17 Javascript
jQuery插件datalist实现很好看的input下拉列表
Jul 14 Javascript
jQuery控制li上下循环滚动插件用法实例(附demo源码下载)
May 28 Javascript
详解vue项目构建与实战
Jun 27 Javascript
判断div滑动到底部的scroll实例代码
Nov 15 Javascript
Vue的移动端多图上传插件vue-easy-uploader的示例代码
Nov 27 Javascript
jQuery实现的回车触发按钮事件功能示例
Mar 25 jQuery
浅谈Vue.js组件(二)
Apr 09 Javascript
vuex入门最详细整理
Mar 04 Javascript
vue prop传值类型检验方式
Jul 30 Javascript
在vue中使用Base64转码的案例
Aug 07 Javascript
js实现复制粘贴的两种方法
Dec 04 Javascript
原生js实现图片轮播特效
Dec 18 #Javascript
js表单中选择框值的获取及表单的序列化
Dec 17 #Javascript
浏览器兼容性问题大汇总
Dec 17 #Javascript
js跨浏览器的事件侦听器和事件对象的使用方法
Dec 17 #Javascript
js调出上下文菜单的实例
Dec 17 #Javascript
快速掌握WordPress中加载JavaScript脚本的方法
Dec 17 #Javascript
JSONObject使用方法详解
Dec 17 #Javascript
You might like
《星际争霸2》终章已出 RTS时代宣告终结
2017/02/07 星际争霸
深入php之规范编程命名小结
2013/05/15 PHP
分享常见的几种页面静态化的方法
2015/01/08 PHP
CodeIgniter中使用Smarty3基本配置
2015/06/29 PHP
php实现解析xml并生成sql语句的方法
2018/02/03 PHP
PHP上传文件及图片到七牛的方法
2018/07/25 PHP
基于jquery的模态div层弹出效果
2010/08/21 Javascript
jquery组件使用中遇到的问题整理及解决
2014/02/21 Javascript
用nodejs实现PHP的print_r函数代码
2014/03/14 NodeJs
浅谈JavaScript实现面向对象中的类
2014/12/09 Javascript
详解js中构造流程图的核心技术JsPlumb
2015/12/08 Javascript
JS取模、取商及取整运算方法示例
2016/10/13 Javascript
JavaScript计时器用法分析【setTimeout和clearTimeout】
2017/01/18 Javascript
jQuery实现滚动效果
2017/11/17 jQuery
React 项目迁移 Webpack Babel7的实现
2018/09/12 Javascript
js贪心算法 钱币找零问题代码实例
2019/09/11 Javascript
使用konva和vue-konva库实现拖拽滑块验证功能
2020/04/27 Javascript
[01:10:03]OG vs EG 2018国际邀请赛淘汰赛BO3 第三场 8.23
2018/08/24 DOTA
Python-基础-入门 简介
2014/08/09 Python
Python遍历目录并批量更换文件名和目录名的方法
2016/09/19 Python
详解python中递归函数
2019/04/16 Python
解决django-xadmin列表页filter关联对象搜索问题
2019/11/15 Python
python turtle 绘制太极图的实例
2019/12/18 Python
python如何实现复制目录到指定目录
2020/02/13 Python
使用css3制作登录表单的步骤
2014/04/07 HTML / CSS
流行文化收藏品:Sideshow(DC漫画,星球大战,漫威)
2019/03/17 全球购物
Street One瑞士:德国现代时装公司
2019/10/09 全球购物
Bonprix法国:时尚、鞋子、家居
2020/12/29 全球购物
室内设计实习自我鉴定
2013/09/25 职场文书
房地产管理毕业生自荐信
2013/11/04 职场文书
运动会四百米广播稿
2014/01/19 职场文书
会议邀请书范文
2014/02/02 职场文书
加入学生会演讲稿
2014/04/24 职场文书
厨师长岗位职责范本
2014/08/25 职场文书
推广普通话主题班会
2015/08/17 职场文书
高三数学复习备考教学反思
2016/02/18 职场文书