js加减乘除丢失精度问题解决方法

在javascript中,当你使用小数进行加减乘除运算时,你会发现,所得到的结果有时后面带有长长的一段小数,使运算变得复杂,并且影响计算结果。上网查询了一下原因,大致如下:在javascript中,带小数的数据运算时总会出现好多位小数.这是因为在javascript中浮点数的计算是以2进制计算的。


代码如下:

/**
* 加法运算,避免数据相加小数点后产生多位数和计算精度损失。
*
* @param num1加数1 | num2加数2
*/
function numAdd(num1, num2) {
var baseNum, baseNum1, baseNum2;
try {
baseNum1 = num1.toString().split(".")[1].length;
} catch (e) {
baseNum1 = 0;
}
try {
baseNum2 = num2.toString().split(".")[1].length;
} catch (e) {
baseNum2 = 0;
}
baseNum = Math.pow(10, Math.max(baseNum1, baseNum2));
return (num1 * baseNum + num2 * baseNum) / baseNum;
};
/**
* 加法运算,避免数据相减小数点后产生多位数和计算精度损失。
*
* @param num1被减数 | num2减数
*/
function numSub(num1, num2) {
var baseNum, baseNum1, baseNum2;
var precision;// 精度
try {
baseNum1 = num1.toString().split(".")[1].length;
} catch (e) {
baseNum1 = 0;
}
try {
baseNum2 = num2.toString().split(".")[1].length;
} catch (e) {
baseNum2 = 0;
}
baseNum = Math.pow(10, Math.max(baseNum1, baseNum2));
precision = (baseNum1 >= baseNum2) ? baseNum1 : baseNum2;
return ((num1 * baseNum - num2 * baseNum) / baseNum).toFixed(precision);
};
/**
* 乘法运算,避免数据相乘小数点后产生多位数和计算精度损失。
*
* @param num1被乘数 | num2乘数
*/
function numMulti(num1, num2) {
var baseNum = 0;
try {
baseNum += num1.toString().split(".")[1].length;
} catch (e) {
}
try {
baseNum += num2.toString().split(".")[1].length;
} catch (e) {
}
return Number(num1.toString().replace(".", "")) * Number(num2.toString().replace(".", "")) / Math.pow(10, baseNum);
};
/**
* 除法运算,避免数据相除小数点后产生多位数和计算精度损失。
*
* @param num1被除数 | num2除数
*/
function numDiv(num1, num2) {
var baseNum1 = 0, baseNum2 = 0;
var baseNum3, baseNum4;
try {
baseNum1 = num1.toString().split(".")[1].length;
} catch (e) {
baseNum1 = 0;
}
try {
baseNum2 = num2.toString().split(".")[1].length;
} catch (e) {
baseNum2 = 0;
}
with (Math) {
baseNum3 = Number(num1.toString().replace(".", ""));
baseNum4 = Number(num2.toString().replace(".", ""));
return (baseNum3 / baseNum4) * pow(10, baseNum2 - baseNum1);
}
};

(0)

相关推荐

  • html+js实现简单的计算器代码(加减乘除)

    html+js实现简单的计算器代码(加减乘除) <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <table> <tr> <td&

  • javascript加减乘除的简单实例

    javascript加减乘除的简单实例 <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> </head> <script language="javascript" type="text/javascript"> //除法函数 function accD

  • 用php简单实现加减乘除计算器

    用php实现加减乘除计算器.代码很简单哦! 复制代码 代码如下: <?php header("content-type:text/html;charset=utf-8"); session_start(); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitiona

  • js加减乘除丢失精度问题解决方法

    在javascript中,当你使用小数进行加减乘除运算时,你会发现,所得到的结果有时后面带有长长的一段小数,使运算变得复杂,并且影响计算结果.上网查询了一下原因,大致如下:在javascript中,带小数的数据运算时总会出现好多位小数.这是因为在javascript中浮点数的计算是以2进制计算的. 复制代码 代码如下: /** * 加法运算,避免数据相加小数点后产生多位数和计算精度损失. * * @param num1加数1 | num2加数2 */ function numAdd(num1,

  • 解决JavaScript数字精度丢失问题的方法

    本文分为三个部分 JS 数字精度丢失的一些典型问题 JS 数字精度丢失的原因 解决方案(一个对象+一个函数) 一.JS数字精度丢失的一些典型问题 1. 两个简单的浮点数相加 0.1 + 0.2 != 0.3 // true 这真不是 Firebug 的问题,可以用alert试试 (哈哈开玩笑). 看看Java的运算结果 再看看Python 2. 大整数运算 16位和17位数竟然相等,没天理啊. 又如 var x = 9007199254740992 x + 1 == x // ? 看结果 三观又

  • SpringBoot主键ID传到前端后精度丢失的问题解决

    目录 简介 问题描述 项目场景 问题描述 实例 问题复现 解决方案 全局处理 局部处理 简介 本文用示例介绍SpringBoot如何解决雪花算法主键ID传到前端后精度丢失问题. 问题描述 Java后端Long类型的范围 -2^63~2^63,即:-9223372036854775808~9223372036854775807,它是19位的. 这个数字可以通过方法获得:Long.MAX_VALUE.Long_MIN_VALUE. 前端JS的数字类型的范围 -2^53~2^53,即:-9007199

  • JS中浮点数精度问题的分析与解决方法

    目录 前言 问题的发现 浮点数运算后的精度问题 toFixed奇葩问题 为什么会产生 浮点数的存储 浮点数的运算 解决方法 解决toFixed 解决浮点数运算精度 附:JS浮点数精度问题的一些实用建议 总结 前言 最近在做项目的时候,涉及到商品价格的计算,经常会出现计算出现精度问题.刚开始草草了事,直接用toFixed就解决了问题,并没有好好的思考一下这个问题.后来慢慢的,问题越来越多,连toFixed也出现了(允悲),后来经过搜索网上的各种博客和论坛,整理总结了一下. 问题的发现 总结了一下,

  • SpringBoot全局配置long转String丢失精度的问题解决

    目录 第一种方式 第二种方式 第三种方式 第四种方式(缺点:将所有的数字类型都会转为字符串) web项目中,Java后端传过来的Long/long类型,前端JS接收会丢失精度. 本文推荐第三.第四种方式 第一种方式 简单粗暴,将所有的Lang类型,改为String,数据库改成varchar类型: 第二种方式 自己建个配置类 extends WebMvcConfigurerAdapter 已经被弃用,直接实现WebMvcConfigurer该接口就行了 @EnableWebMvc @Configu

  • Java序列化JSON丢失精度问题的解决方法(修复Long类型太长)

    目录 原因: 解决办法一: 解决办法(二): 总结 Java序列化JSON时long型数值,会出现精度丢失的问题. 原因: java中得long能表示的范围比js中number大,也就意味着部分数值在js中存不下(变成不准确的值). 解决办法一: 使用ToStringSerializer的注解,让系统序列化时,保留相关精度 @JsonSerialize(using=ToStringSerializer.class) private Long createdBy; 上述方法需要在每个对象都配上该注

  • 利用Math.js解决JS计算小数精度丢失问题

    目录 缘由 问题的原因 最通俗的解释 解决方案 - Math.js 安装 封装 使用 附:math.js 大数功能 总结 缘由 最近在做公司的一个点餐H5项目需要前端动态计算用户选的商品的总价(单价*数量)和购物车的总价格时发现关于 JavaScript 浮点数计算精度不准确问题.在控制台输入0.1+0.2也能发现此问题. // 加法 0.1 + 0.2 = 0.30000000000000004 0.7 + 0.1 = 0.7999999999999999 0.2 + 0.4 = 0.6000

  • JS 调试中常见的报错问题解决方法

    报错:Uncaught SyntaxError: Unexpected token o in JSON at position 1 at JSON.parse (<anonymous>) at Function.m.parseJSON (jquery.js:8515) at Object.success (crud.html:45) at j (jquery.js:3143) at Object.fireWith [as resolveWith] (jquery.js:3255) at x (

  • Yii框架用户登录session丢失问题解决方法

    本文实例讲述了Yii框架用户登录session丢失问题解决方法.分享给大家供大家参考,具体如下: 最近做项目,使用的是YII框架,用户的登录总是出现有时候能登录,有时候不能登录的情况.调试了很多次,开始以为是服务器配置问题,后来怎么测试都不行,还是出现有时候登录session丢失的情况,没办法,在群里面问,发帖,请教大拿,最后都没有发现什么问题. 无意间在网上看到一个人说yii session丢失的问题.终于解决了,解决方法: 初步解决方法: 打开文件 yii\framework\web\aut

  • vue.js element-ui validate中代码不执行问题解决方法

    先说结论 在自定义验证里面每一个判断都要有callback(),就是要保证callback()一定会执行到 因为要验证数字,参考了官网参考代码如下,发现有如下图bug,当输入为以数字开头包含字符串的内容时,验证不会报错,因为业务逻辑也不相符,随改写代码 <el-form-item label="年龄" prop="age"> <el-input v-model.number="ruleForm2.age"></el-

随机推荐