Home > Web Front-end > JS Tutorial > body text

How to solve js floating point number precision problem

一个新手
Release: 2017-09-25 10:34:06
Original
1596 people have browsed it

Most languages ​​will encounter precision problems when dealing with floating point numbers, but it seems to be particularly serious in JS. Let’s look at an example

alert(45.6*13);
Result It is actually 592.800000000001. Of course, addition and the like will also have this problem.
Is this a js error?
Of course not, your computer is doing correct binary floating point operations, but the problem is that you input decimal numbers, and the computer operates in binary. The two do not always convert so well, and sometimes you get Correct result, but sometimes you are not so lucky
alert(0.7+0.1);//Output 0.7999999999999999
alert(0.6+0.2);//Output 0.8

You enter two When decimal numbers are converted into binary and then converted back, there will naturally be losses during the conversion process
But the general losses are often more in multiplication and division operations, and JS will also appear in simple addition and subtraction. You have also seen the problem. This error is also very small, but it should not occur.
So how to solve it? ECMA4 seems to have a solution, but it is not such a practical method now
, such as 0.7+0.1, first multiply both 0.1 and 0.7 by 10, and then divide by 10 after adding.
In addition, you can write some functions yourself to solve this problem. There should be many on Baidu and Google, but it is best not to use JS Do some complex floating point operations, after all, JS is not more useful here

<script type="text/javascript">  

    // 两个浮点数求和  
    function accAdd(num1,num2){  
       var r1,r2,m;  
       try{  
           r1 = num1.toString().split(&#39;.&#39;)[1].length;  
       }catch(e){  
           r1 = 0;  
       }  
       try{  
           r2=num2.toString().split(".")[1].length;  
       }catch(e){  
           r2=0;  
       }  
       m=Math.pow(10,Math.max(r1,r2));  
       // return (num1*m+num2*m)/m;  
       return Math.round(num1*m+num2*m)/m;  
    }  

    // 两个浮点数相减  
    function accSub(num1,num2){  
       var r1,r2,m;  
       try{  
           r1 = num1.toString().split(&#39;.&#39;)[1].length;  
       }catch(e){  
           r1 = 0;  
       }  
       try{  
           r2=num2.toString().split(".")[1].length;  
       }catch(e){  
           r2=0;  
       }  
       m=Math.pow(10,Math.max(r1,r2));  
       n=(r1>=r2)?r1:r2;  
       return (Math.round(num1*m-num2*m)/m).toFixed(n);  
    }  
    // 两数相除  
    function accp(num1,num2){  
       var t1,t2,r1,r2;  
       try{  
           t1 = num1.toString().split(&#39;.&#39;)[1].length;  
       }catch(e){  
           t1 = 0;  
       }  
       try{  
           t2=num2.toString().split(".")[1].length;  
       }catch(e){  
           t2=0;  
       }  
       r1=Number(num1.toString().replace(".",""));  
       r2=Number(num2.toString().replace(".",""));  
       return (r1/r2)*Math.pow(10,t2-t1);  
    }  

    function accMul(num1,num2){  
       var m=0,s1=num1.toString(),s2=num2.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);  
    }  

  </script>  

    <script>  
    document.write("使用js原生态方法");  
    document.write("<br/> 1.01 + 1.02 ="+(1.01 + 1.02));  
    document.write("<br/> 1.01 - 1.02 ="+(1.01 - 1.02));  
    document.write("<br/> 0.000001 / 0.0001 ="+(0.000001 / 0.0001));  
    document.write("<br/> 0.012345 * 0.000001 ="+(0.012345 * 0.000001));  
    document.write("<br/><hr/>");  
    document.write("<br/>使用自定义方法");  
    document.write("<br/> 1.01 + 1.02 ="+accAdd(1.01,1.02));  
    document.write("<br/> 1.01 - 1.02 ="+accSub(1.01,1.02));  
    document.write("<br/> 0.000001 / 0.0001 ="+accp(0.000001,0.0001));  
    document.write("<br/> 0.012345 * 0.000001 ="+accMul(0.012345,0.000001));  
    </script>
Copy after login

The above is the detailed content of How to solve js floating point number precision problem. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!