JavaScript で少数計算をすると何やら結果がおかしくなる件

JavaScript で少数計算をすると何やら結果がおかしくなる現象に遭遇して悩みました。

例えば、「0.1」と「0.02」を合計すると値が「0.12000000000000001」となってしまい摩訶不思議。以下のような入力値を合計するだけの簡単なプログラムで特に問題はなさそうですが。。。

$(':text').each(function() {

  total += $(this).val();

});

$('div').text(total);

 

いろいろ調べてみると、JavaScriptがIEEE 754という規格を採用しているからだそうです。

小数点以下2桁以降は必要ないので、以下の処理を追加して解決できました。

total = Math.round(total * 100) / 100;

以下の記事がとてもよく理解できました。

日経PC21 / 演算誤差の正体 - IEEE 754 浮動小数点数の仕組み