The reason

Recently, I found that the calculation accuracy of JavaScript floating-point number was not accurate when the front-end dynamic calculation of the total price (unit price * quantity) of goods selected by users and the total price of shopping cart was needed in the company’s ordering H5 project. This problem can also be found by typing 0.1+0.2 on the console.

// Add 0.1 + 0.2 = 0.30000000000000004 0.7 + 0.1 = 0.7999999999999999 0.2 + 0.4 = 0.6000000000000001 // subtract 1.5-1.2 = 0.30000000000000004 0.3-0.2 = 0.09999999999999998 // multiplication 19.9 * 100 = 1989.9999999999998 0.8 * 3 = 2.40000000000000000004 35.41 * 100 = 3540.9999999999995 // Division 0.3/0.1 = 2.99999999999996 0.69/10 = 0.06899999999999999Copy the code

Cause of the problem

Why does 0.1+ 0.2js not add? Why floating-point calculations are inaccurate: From a computer’s point of view, computers work in binary, not decimal. Binary becomes a number that does not loop wirelessly, while computers can support the decimal part of floating point numbers up to 52 bits. When you add the two together, when converted to decimal, you get an inaccurate number, which works the same way.

The decimal system binary
0.1 0.0001 1001 1001 1001…
0.2 0.0011 0011 0011 0011…
0.3 0.0100 1100 1100 1100…
0.4 0.0110 0110 0110 0110…
0.5 0.1
0.6 0.1001 1001 1001 1001…

So after combined get so a bunch of 0.0100110011001100110011001100110011001100110011001100 for floating-point decimal places restrictions and truncated binary digits, at this time, we’ll convert it to a decimal, That’s 0.30000000000000004.

The most popular explanation

For example, a number 1÷3=0.33333333…… We all know that 3 will always be infinite loop, mathematics can express, but the computer needs to store, easy to take out and reuse next time, but 0.333333…… How do you tell the computer to store this number in an infinite loop? A computer can’t hold all the memory it has, can it? So you can’t store a value relative to the math, you can only store an approximate value, so when the computer stores it and then takes it out, there will be accuracy problems.

Solution – math.js

Math.js supports the BigNumber data type for calculations of arbitrary precision.

The installation
npm install mathjs
Copy the code

Note that to use mathJS in a TypeScript project, you must also install the type definition file: NPM install @types/mathjs.

encapsulation
import * as math from 'mathjs'; Export default {// add add(num1,num2){return math.add(math.bignumber(num1),math.bignumber(num2)); }, // Multiply (num1,num2){return math.multiply(math.bignumber(num1),math.bignumber(num2)); }, // Subtract (num1,num2){return math. Subtract (math.bignumber(num1),math.bignumber(num2)); }, // Divide (num1,num2){return math.divide(math.bignumber(num1),math.bignumber(num2)); }}Copy the code
use
Import math from './math.js' let addNum = math.add(3,2); Multiply (3,2); multiply(3,2); // 6 let subNum = math. Subtract (3,2); // 1 let divNum = math. Add (3,2); / / 1.5Copy the code