【JS】toFixed()无法精准保留小数的解决方案

2023-12-07 10:44

本文主要是介绍【JS】toFixed()无法精准保留小数的解决方案,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

情景复现:

发现用 toFiexd()  四舍五入保留小数有时不是很精确,接下来用 a = 8.0345,b=8.045,举例如下:

var a = 8.035;
console.log(a.toFixed(2)) // 8.04
var b = 8.045;
console.log(b.toFixed(2)) // 8.04

不难看出 a 四舍五入保留两位小数为 8.04,正确;而 b 四舍五入保留两位小数应该为 8.05;

计算精度丢失的原因:

js采用64位浮点数表示法(几乎所有现代编程语言所采用),这是一种二进制表示法。二进制浮点数表示法并不能精确表示类似 0.1 这样简单的数字。

目前这个问题不只在js中才会出现,在任何使用二进制浮点数的编程语言中都会出现。

解决方案:

保留两位小数:
var a = 8.035;
var b = 8.045;
function number(data){var value = Math.round(parseFloat(data) * 100) / 100;var d = value.toString().split(".");if (d.length == 1) {value = value.toString() + ".00";return value;}if (d.length > 1) {if (d[1].length < 2) {console.log(d[1])value = value.toString() + "0";}return value;}
}
console.log(number(a));  // 8.04
console.log(number(b));  // 8.05
自定义封装:

方案一: 使用 big.js(如果有大量连续的计算推荐使用)

  • 既解决了浮点数计算精度丢失问题,又解决了 toFixed() 四舍五入精度丢失问题。
  • big.js 是 big.jsbignumber.jsdecimal.js 三姐妹中功能最少的,但也是体积最小的,压缩版只有3k,对于处理js精度丢失已经足够用了。
  import Big from 'big.js'// 运算const plus = Big(0.1).plus(0.2); // 加const minus = Big(0.3).minus(0.1); // 减const mul = Big(10.22).times(100); // 乘const div = Big(2.4).div(0.8); // 除// toFixedconst fixed = new Big(6.265).toFixed(2); // 6.27console.log(plus.toNumber(),minus.toNumber(),mul.toNumber(),div.toNumber())// 0.3 0.2 1022 3

 方案二:有具体要求精确到第几位,用科学计数法对运算结果进行四舍五入

function round(number, precision) {return Math.round(+number + 'e' + precision) / Math.pow(10, precision);
}round(8.1234567, 5);    // 8.12346

或者: 

function number(data,n){var numbers = '';// 保留几位小数后面添加几个0for (var i = 0; i < n; i++) {numbers += '0';}var s = 1 + numbers;// 如果是整数需要添加后面的0var spot = "." + numbers;// Math.round四舍五入  //  parseFloat() 函数可解析一个字符串,并返回一个浮点数。var value = Math.round(parseFloat(data) * s) / s;// 从小数点后面进行分割var d = value.toString().split(".");if (d.length == 1) {value = value.toString() + spot;return value;}if (d.length > 1) {if (d[1].length < 2) {value = value.toString() + "0";}return value;}
}// 例如:8.1235678 保留五位小数
number(8.12356,5); 

这篇关于【JS】toFixed()无法精准保留小数的解决方案的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/465564

相关文章

idea粘贴空格时显示NBSP的问题及解决方案

《idea粘贴空格时显示NBSP的问题及解决方案》在IDEA中粘贴代码时出现大量空格占位符NBSP,可以通过取消勾选AdvancedSettings中的相应选项来解决... 目录1、背景介绍2、解决办法3、处理完成总结1、背景介绍python在idehttp://www.chinasem.cna粘贴代码,出

精准寻车+鸿蒙有礼特别版均已上线! 华为鸿蒙HarmonyOS 6负一屏新升级

《精准寻车+鸿蒙有礼特别版均已上线!华为鸿蒙HarmonyOS6负一屏新升级》不少朋友升级华为鸿蒙HarmonyOS6后,发现华为负一屏此次也新增了精准寻车功能,还为过往鸿蒙5.1及以上用户再度... 最近科技圈热议话题当属华为全新发布的Mate 80系列,这次不仅有全金属机身,第二代红枫影像和全新麒麟新品

nacos服务无法注册到nacos服务中心问题及解决

《nacos服务无法注册到nacos服务中心问题及解决》本文详细描述了在Linux服务器上使用Tomcat启动Java程序时,服务无法注册到Nacos的排查过程,通过一系列排查步骤,发现问题出在Tom... 目录简介依赖异常情况排查断点调试原因解决NacosRegisterOnWar结果总结简介1、程序在

Apache服务器IP自动跳转域名的问题及解决方案

《Apache服务器IP自动跳转域名的问题及解决方案》本教程将详细介绍如何通过Apache虚拟主机配置实现这一功能,并解决常见问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,... 目录​​问题背景​​解决方案​​方法 1:修改 httpd-vhosts.conf(推荐)​​步骤

Linux(centos7)虚拟机没有IP问题及解决方案

《Linux(centos7)虚拟机没有IP问题及解决方案》文章介绍了在CentOS7中配置虚拟机网络并使用Xshell连接虚拟机的步骤,首先,检查并配置网卡ens33的ONBOOT属性为yes,然后... 目录输入查看ZFhrxIP命令:ip addr查看,没有虚拟机IP修改ens33配置文件重启网络Xh

Java编译错误java.lang.NoSuchFieldError的解决方案详析

《Java编译错误java.lang.NoSuchFieldError的解决方案详析》java.lang.NoSuchFieldError是Java中的一种运行时错误,:本文主要介绍Java编译错... 目录前言解决方案1. 统一JDK版本环境2. 优化maven-compiler-plugin配置3. 清

Navicat连接Mysql8.0.11出现1251错误的解决方案

《Navicat连接Mysql8.0.11出现1251错误的解决方案》在重装电脑并安装最新版MySQL后,Navicat和Sqlyog连接MySQL时遇到的1251和2058错误,通过将MySQL用户... 目录Navicat连接mysql8.0.11出现1251错误原因分析解决问题方法有两种总结Navic

tomcat日志中文乱码问题及解决方案

《tomcat日志中文乱码问题及解决方案》文章主要介绍了在使用Tomcat时遇到的乱码问题及其解决方法,页面输出乱码可能由于server.xml配置、HTML标签、编程输出编码不一致引起,解决方法包括... 目录一、页面输出乱码1.server.XML配置未注明编码格式2.catalina.bawww.cp

JS纯前端实现浏览器语音播报、朗读功能的完整代码

《JS纯前端实现浏览器语音播报、朗读功能的完整代码》在现代互联网的发展中,语音技术正逐渐成为改变用户体验的重要一环,下面:本文主要介绍JS纯前端实现浏览器语音播报、朗读功能的相关资料,文中通过代码... 目录一、朗读单条文本:① 语音自选参数,按钮控制语音:② 效果图:二、朗读多条文本:① 语音有默认值:②

在Node.js中使用.env文件管理环境变量的全过程

《在Node.js中使用.env文件管理环境变量的全过程》Node.js应用程序通常依赖于环境变量来管理敏感信息或配置设置,.env文件已经成为一种流行的本地管理这些变量的方法,本文将探讨.env文件... 目录引言为什么使php用 .env 文件 ?如何在 Node.js 中使用 .env 文件最佳实践引