DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> js小數運算出現多位小數如何解決
js小數運算出現多位小數如何解決
編輯:關於JavaScript     

和大家分享一個有趣的測試:

0.1+0.2 == 0.3 //false
頓時郁悶,好吧!原來0.1+0.2變成:0.30000000000000004
再來一個 2.4/0.8 =>2.9999999999999996 沒辦法換種方式,都轉換成整數 (2.4 * 100)/(0.8 * 100)
10.22 現在要減去 0.11 結果值又出現了很多的小數 10.110000000000001,然後我就用了 toFixed 方法來過濾小數,但是不知道跟前面那種轉換成整數後再執行哪種效率高,好!還是試下再說吧!

var date1 = new Date();
for(var i = 0; i < 10000; i++){
 var result1 = (10.22 - 0.11).toFixed(2);    
}
alert(new Date() - date1);//效率低
  
var date2 = new Date();
for(var j = 0; j < 10000; j++){
 var result2 = (10.22 * 1000 - 0.11 * 1000) / 1000;    
}
alert(new Date() - date2);//效率高
 
alert(0.1 + 0.2 == 0.3); //既然返回false
alert(0.1 + 0.2); //既然返回0.30000000000000004
alert(parseFloat(0.1) + parseFloat(0.2)); //還是返回0.30000000000000004

查了一些資料,一是 JavaScript 浮點數計算的 Bug,另一個是和計算機最終轉換成二進制計算有關系,但是為什麼不是所有小數都會有這種現象,目前我也不清楚,有時間再去深入研究一下。

解決方法:
解決這種問題兩種方法,第一種就是利用JavaScript 的toFixed(n) 方法,直接獲取N 位小數,不過,個人覺得這種方法在數據精度上會有一些問題。如果數據精度要求不高的話可以使用。

alert((0.1 + 0.2).toFixed(1));

第二種方法就是自己編寫運算方法。以下是自定義加法函數,使用此方法進行相加會避免上面問題。

//自定義加法運算
function addNum (num1, num2) {
 var sq1,sq2,m;
 try {
  sq1 = num1.toString().split(".")[1].length;
 }
 catch (e) {
  sq1 = 0;
 }
 try {
  sq2 = num2.toString().split(".")[1].length;
 }
 catch (e) {
  sq2 = 0;
 }
 m = Math.pow(10,Math.max(sq1, sq2));
 return (num1 * m + num2 * m) / m;
}
alert(addNum(0.1, 0.2));

當然,簡單一點也可以寫成:alert((num * 3 + 10 * 3) /3); 這樣也不會出現 N 多位小數。
alert((num * 3 + 10 * 3) /3); 與 alert(num + 10); 這兩種寫法計算機在底層轉換成二進制運算是有區別的,或許這就是出現上述問題的原因,還有待我們去深入研究,大家可以多多討論。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved