vue加减乘除计算后精度缺失显示为科学计数

前端在操作加减乘除计算时,经常会出现精度缺失问题,有时会显示为科学计数的样式。这里将记录如何确保在计算后精度不会缺失,并且将科学计数转换为小数。

1.下载相关依赖 :   npm run mathjs

2.在本项目中新建文件封装:

 具体代码如下:

let $math = require('mathjs');
// import $math from 'mathjs'
const math = {
   //加法
  add() {
    return comp('add', arguments)
  },
   //减法
  subtract() {
    return comp('subtract', arguments)
  },
    // 乘法
  multiply() {
    return comp('multiply', arguments)
  },
   // 除法
  divide() {
    return comp('divide', arguments)
  },
}
 
function comp(_func, args) {
  let t = $math.chain($math.bignumber(args[0]));
  for (let i=1; i<args.length; i++) {
    t = t[_func]($math.bignumber(args[i]))
  }
  // 防止超过6位使用科学计数法
  return parseFloat(t.done())
}
export default math;

3. 在文件中引用:

 4. 具体操作:

//举例:减法
let num1 = math.subtract(num2,num3);

此时已经确保两数相减时不会出现精度丢失问题,但是计算结果小数位数过长时还是会显示为科学计数,下面方法则是用于将科学计数显示为小数:

scientificToNumber: function(inputNumber) {
   if (isNaN(inputNumber)) {
       return inputNumber
   }
   inputNumber = '' + inputNumber
   inputNumber = parseFloat(inputNumber)
   let eformat = inputNumber.toExponential() // 转换为标准的科学计数法形式(字符串)
   let tmpArray = eformat.match(/\d(?:\.(\d*))?e([+-]\d+)/) // 分离出小数值和指数值
   let number = inputNumber.toFixed(Math.max(0, (tmpArray[1] || '').length - tmpArray[2]))
   return number;
}

至此,完善举例

//举例:减法
let num1 = this.scientificToNumber(math.subtract(num2,num3));

如有问题,欢迎指正!

猜你喜欢

转载自blog.csdn.net/weixin_50606255/article/details/126259897