【JavaScript】固定小数点形式に変換しよう！【toFixed】

みなさんこんにちは、現役エンジニアのサメハックです

アパレル企業でトップ販売員を経て
未経験からWebエンジニアに転職し、
現在正社員として5年働いています！

今回はJavaScriptで固定小数点形式に変換する方法について学んでいきましょう！

駆け出しエンジニアや未経験の方、
また新入社員を指導する先輩社員にとっても
わかりやすいように解説していきます！

固定小数点形式とは

固定小数点形式とは、小数点が置かれる桁を固定して表された数のことです。

文字で書くとなんだかややこしく聞こえてしまいますが、
1.00 のように、小数点以下の桁数を指定する形式です。

固定小数点形式に変換しよう

toFixed関数を使おう！

JavaScriptで固定小数点形式に変換するには
toFixed関数を使います。

構文

数値.toFixed(小数点以下の桁数)

toFixed関数を使ってみよう！

ここでは 1 という数値を 1.00 という表記に変換してみましょう。

// 数値の宣言
const num = 1;

console.log(num.toFixed(2));

【出力結果】
1.00

このように変換が完了しました。

toFixedの重大な問題点

toFixed関数は便利なのですが、変換後に文字列型に変更されてしまう！
という重大な問題点があります。

・・・が！
数値の前に + を記述することで、意図せぬ型変換を回避できます。

構文

+数値.toFixed(小数点以下の桁数)

実際に確認してみましょう

// 数値の宣言
const num = 1;

console.log(num.toFixed(2));

// 型の確認
console.log(typeof(num.toFixed(2)));

// 型の確認 ※+を付与
console.log(typeof(+num.toFixed(2)));

【出力結果】
1.00
string
number

このように+の有無で型が変わることが確認できました。

型の確認を行うtypeof関数について復習したい方はこちら！

【JavaScript】型の確認をしよう！【typeof】

samehack.com

まとめ

満足いただけたら、1クリックなのでSNSフォローしてもらえると嬉しいです🦈

twitter
instagram