数値を「小数点以下 n 桁」にそろえるという発想
num.toFixed(2) は、数値を「小数点以下 2 桁」にそろえて文字列として返すメソッドです。 たとえば金額表示や平均値の表示など、「見た目をきれいに整えたい場面」で非常によく使われます。
天才プログラマー視点で言うと、「計算結果をそのまま出すと桁がバラバラになる問題」を一発で解決する道具が toFixed です。
小数点以下を 2 桁にそろえる基本動作
まずは最もよく使う例から見てください。
const num = 3.14159;
const fixed = num.toFixed(2);
console.log(fixed); // "3.14"
JavaScriptここで重要なのは、 返り値が数値ではなく「文字列」になるという点です。
3.14159 を「見た目として 3.14 に整える」ためのメソッドなので、 計算用の数値というより「表示用の文字列」を作るための機能だと理解するとスッと入ります。
四捨五入されることを深掘りする
toFixed は、ただ切り捨てるのではなく 四捨五入 します。
(3.146).toFixed(2); // "3.15"
(3.144).toFixed(2); // "3.14"
JavaScriptつまり、 「小数点以下 n 桁に丸める」という動きをしているわけです。
計算結果を丸めて表示したいときに非常に便利です。
桁数を自由に変えられる
toFixed の引数は「小数点以下の桁数」です。
const num = 1.2345;
num.toFixed(0); // "1"
num.toFixed(1); // "1.2"
num.toFixed(3); // "1.234"
num.toFixed(5); // "1.23450"
JavaScript桁数を増やすと、足りない部分は 0 で埋められます。 これが「固定小数点」という名前の由来です。
実務でよくある例:金額表示をそろえる
金額やポイント表示は、桁が揃っていると読みやすくなります。
const price = 1200;
console.log(price.toFixed(2)); // "1200.00"
JavaScriptEC サイトや請求書などでは、 「小数点以下 2 桁で統一する」というルールがよく使われます。
実務でよくある例:平均値の見た目を整える
計算結果は桁がバラバラになりがちです。
const avg = 7 / 3;
console.log(avg); // 2.3333333333333335
console.log(avg.toFixed(2)); // "2.33"
JavaScriptこのように、 「計算結果を人間が読みやすい形に整える」ために toFixed は欠かせません。
数値として使いたい場合は Number に戻す
toFixed は文字列を返すため、そのまま計算に使うと困ることがあります。
const s = (3.14).toFixed(2); // "3.14"
const n = Number(s); // 3.14(数値に戻す)
JavaScript計算に使うなら Number() や parseFloat() で数値に戻してください。
まとめ:toFixed は「見た目を整えるための小数点フォーマッタ」
num.toFixed(2) を使いこなすと、 数値の表示が一気に整い、読みやすさが大きく向上します。
- 小数点以下の桁数をそろえる
- 四捨五入される
- 足りない桁は 0 で埋まる
- 返り値は文字列なので注意
- 金額・平均値・統計表示などで大活躍
「この数値、見た目をきれいに整えたい」と感じた瞬間に、 まず toFixed を思い出していただきたいです。
次に知っておくと便利なのは、 数値フォーマットの違い や Intl.NumberFormat を使った本格的な数値整形 です。
