详解js加减乘除精确计算


Posted in Javascript onMarch 19, 2019

JS无法进行精确计算的bug

在做CRM,二代审核需求审核详情页面时。需要按比例(后端传类似0.8的小数)把用户输入的数字显示在不同的地方。
在做dubheInvest = invest * (1 - ratio);运算时发现问题。具体如下:
示例代码:

console.log( 1 - 0.8 ); //输出 0.19999999999999996 
console.log( 6 * 0.7 ); //输出 4.199999999999999 
console.log( 0.1 + 0.2 ); //输出 0.30000000000000004 
console.log( 0.1 + 0.7 ); //输出 0.7999999999999999 
console.log( 1.2 / 0.2 ); //输出 5.999999999999999

通过上面举出的例子可以看到,原生的js运算结果不一定准确,会丢失精度。

解决方案

解决方案的原理是,将浮点数乘以(扩大)10的n次方倍,把浮点数变为整数后再进行相应的运算,最后将得到的结果除以(缩小)10的n次方倍。

原理示例:

将console.log(1-0.8);  变为 console.log((1 * 10 - 0.8 * 10) / 10); 即可得到正确的值
根据上述原理,可以封装一些方法出来解决此类问题。如下所示(Math.pow(x, y);表示求x的y次方):

//加 
function floatAdd(arg1,arg2){ 
  var r1,r2,m; 
  try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0} 
  try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0} 
  m=Math.pow(10,Math.max(r1,r2)); 
  return (arg1*m+arg2*m)/m; 
} 
  
//减 
function floatSub(arg1,arg2){ 
 var r1,r2,m,n; 
 try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0} 
 try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0} 
 m=Math.pow(10,Math.max(r1,r2)); 
 //动态控制精度长度 
 n=(r1>=r2)?r1:r2; 
 return ((arg1*m-arg2*m)/m).toFixed(n); 
} 
  
//乘 
function floatMul(arg1,arg2) { 
 var m=0,s1=arg1.toString(),s2=arg2.toString(); 
 try{m+=s1.split(".")[1].length}catch(e){} 
 try{m+=s2.split(".")[1].length}catch(e){} 
 return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m); 
} 
  
  
//除 
function floatDiv(arg1,arg2){ 
  var t1=0,t2=0,r1,r2; 
  try{t1=arg1.toString().split(".")[1].length}catch(e){} 
  try{t2=arg2.toString().split(".")[1].length}catch(e){} 
   
  r1=Number(arg1.toString().replace(".","")); 
 
  r2=Number(arg2.toString().replace(".","")); 
  return (r1/r2)*Math.pow(10,t2-t1); 
}

以上所述是小编给大家介绍的js加减乘除精确计算详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
左右悬浮可分组的网站QQ在线客服代码(可谓经典)
Dec 21 Javascript
js加强的经典分页实例
Mar 15 Javascript
Jquery实现自定义tooltip示例代码
Feb 12 Javascript
JavaScript动态修改弹出窗口大小的方法
Apr 06 Javascript
JavaScript操作class和style样式代码详解
Feb 13 Javascript
Javascript 事件冒泡机制详细介绍
Oct 10 Javascript
bootstrap提示标签、提示框实现代码
Dec 28 Javascript
js正则表达式验证表单【完整版】
Mar 06 Javascript
详解vue项目构建与实战
Jun 27 Javascript
Vuex 入门教程
Jan 10 Javascript
Vue2实时监听表单变化的示例讲解
Aug 30 Javascript
jquery实现有过渡效果的tab切换
Jul 17 jQuery
jQuery添加新内容的四个常用方法分析【append,prepend,after,before】
Mar 19 #jQuery
浅谈JavaScript_DOM学习篇_图片切换小案例
Mar 19 #Javascript
vue多层嵌套路由实例分析
Mar 19 #Javascript
vue组件数据传递、父子组件数据获取,slot,router路由功能示例
Mar 19 #Javascript
vue项目移动端实现ip输入框问题
Mar 19 #Javascript
详解使用React.memo()来优化函数组件的性能
Mar 19 #Javascript
vue组件定义,全局、局部组件,配合模板及动态组件功能示例
Mar 19 #Javascript
You might like
PHP如何解决网站大流量与高并发的问题
2011/06/25 PHP
万能的php分页类
2017/07/06 PHP
PHP常见的几种攻击方式实例小结
2019/04/29 PHP
php+layui数据表格实现数据分页渲染代码
2019/10/26 PHP
jquery 学习之二 属性 文本与值(text,val)
2010/11/25 Javascript
jquery ajax修改全局变量示例代码
2013/11/08 Javascript
jQuery实现鼠标经过图片预览大图效果
2014/04/10 Javascript
浏览器窗口大小变化时使用resize事件对框架不起作用的解决方法
2014/05/11 Javascript
JSP中使用JavaScript动态插入删除输入框实现代码
2014/06/13 Javascript
JS+CSS实现淡入式焦点图片幻灯切换效果的方法
2015/02/26 Javascript
js实现向右横向滑出的二级菜单效果
2015/08/27 Javascript
JS实现样式清新的横排下拉菜单效果
2015/10/09 Javascript
jQuery实现进度条效果代码
2015/12/17 Javascript
angular2 组件之间通过service互相传递的实例
2018/09/30 Javascript
NodeJS使用Range请求实现下载功能的方法示例
2018/10/12 NodeJs
JavaScript之解构赋值的理解
2019/01/30 Javascript
在vue中获取微信支付code及code被占用问题的解决方法
2019/04/16 Javascript
Vue-input框checkbox强制刷新问题
2019/04/18 Javascript
微信小程序实现用table显示数据库反馈的多条数据功能示例
2019/05/07 Javascript
详细分析React 表单与事件
2020/07/08 Javascript
Django自定义分页与bootstrap分页结合
2021/02/22 Python
react+django清除浏览器缓存的几种方法小结
2019/07/17 Python
Pycharm连接远程服务器并实现远程调试的实现
2019/08/02 Python
python将dict中的unicode打印成中文实例
2020/05/11 Python
CSS3过渡transition效果实例介绍
2016/05/03 HTML / CSS
高级运动鞋:GREATS
2019/07/19 全球购物
德国50岁以上交友网站:Lebensfreunde
2020/03/18 全球购物
Armor Lux法国官方网站:水手服装、成衣和内衣
2020/05/26 全球购物
个人思想理论学习的自我鉴定
2013/11/30 职场文书
大一军训感言
2014/01/09 职场文书
银行进社区活动总结
2014/07/07 职场文书
2014年办公室文秘工作总结
2014/12/09 职场文书
2015年大学生实习评语
2015/03/25 职场文书
音乐之声观后感
2015/06/04 职场文书
优秀共产党员主要事迹材料
2015/11/05 职场文书
教你如何用cmd快速登录服务器
2022/06/10 Servers