NITS TIPS

~微塵集合知巧~

丸め誤差に対応した計算方法

最終更新日: 2024-04-08記事投稿日: 2024-03-31

nobumitsu-1995のgithubトップ

Frontend developer

nobumitsu-1995


概要

ECサイト等でよく見られるレビュー「★★★☆☆」

この表示を作るために数値計算の処理を入れていましたが、ある条件における星の表示数にズレが生じていることに気がつきました。

原因を調べると引き算の結果に誤差が埋めれていることがわかりました。所謂「丸め誤差」というやつです。


丸目誤差とは

丸め誤差(round-off error)とは、長い桁や無限桁の小数を扱う際に、これを有限桁で表すためにある桁以降の値を捨ててしまうことにより生じる誤差のこと。コンピュータでは浮動小数点型の数値計算などで現れる。

https://e-words.jp/w/%E4%B8%B8%E3%82%81%E8%AA%A4%E5%B7%AE.html

コンピュータで浮動小数点型の数値計算を行う場合、2進法によって実行されます。例えば10進数の「0.1」という数字は2進数では「0.000110011...」となるため、場合によって、微妙な計算誤差が生まれてしまいます。


対応方法

以下のような「(目的の計算)×100をした上でMath.roundで四捨五入してあげて最後に100で割って元に戻す」みたいな方法で回避できます。

関数化しておくと便利そうですね👀

Math.round((x - y) * 100) / 100

参考サイト


関連記事

  • 最終更新日: 2025-06-28記事投稿日: 2025-06-28

    画像スライダーのクラッシュから学ぶ、「仮想化」で実現するパフォーマンス改善

    大量の画像を扱うSwiperスライダーが特定のデバイスでクラッシュする問題が発生。解決策としてSwiperの「Virtual」オプションを導入し、表示領域内のスライドのみをレンダリングする「仮想化」を実現。これによりDOM要素とメモリ使用量が劇的に削減され、クラッシュが解消し、スライダーの動作が安定しました。この仮想化技術は、無限スクロールなど大量のコンテンツを扱うウェブアプリケーション全般のパフォーマンス改善に極めて有効です。

  • 最終更新日: 2025-01-11記事投稿日: 2025-01-11

    TypeScriptにおける「hoge?: string」と「hoge: string | undefined」 の違い

    TypeScriptの型システムで「プロパティがundefinedを取りうる」のを表現する方法としてオプショナルプロパティを使用した書き方とユニオン型を使用した書き方の二通りが考えられます。この二つの違いについてまとめてみました。

  • 最終更新日: 2024-08-06記事投稿日: 2024-08-06

    ARIA属性を活用したアクセシブルなモーダル実装

    アクセシブルなmodalを実装するために必要なaria属性が意外と多い。参考となるコードをメモとして残しておきたい。

  • 最終更新日: 2024-07-27記事投稿日: 2024-07-27

    swiper/reactで実装したカルーセルをTAB操作した時、画面に描画されていないスライドにフォーカスが当たってしまう

    swiper/reactで実装したカルーセルをTABキーで操作した時、画面に描画されていないスライドにもフォーカスが当たってしまう問題があり、それの修正対応をしたので備忘録として残しておく。

© 2024. nobumitsu-1995