みなさんこんにちは、現役エンジニアのサメハックです
アパレル企業でトップ販売員を経て
未経験からWebエンジニアに転職し、
現在正社員として5年働いています!
今回はJavaScriptで固定小数点形式に変換する方法について学んでいきましょう!
駆け出しエンジニアや未経験の方、
また新入社員を指導する先輩社員にとっても
わかりやすいように解説していきます!
この記事を読むと・・・
- 固定小数点形式がわかる
- 固定小数点形式への変換方法がわかる
- 変換後の型の変更ができる
- toFixed関数が使えるようになる
測定データの表示をする際に便利な関数だよ!
固定小数点形式とは
固定小数点形式とは、小数点が置かれる桁を固定して表された数のことです。
文字で書くとなんだかややこしく聞こえてしまいますが、
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】
まとめ
- 固定小数点形式とは、小数点が置かれる桁を固定して表された数のこと
- 固定小数点形式に変換するにはtoFixed関数を使う
- 数値.toFixed(小数点以下の桁数)
- 数値の前に+を付与することで文字列型への変換を回避する
- +数値.toFixed(小数点以下の桁数)
満足いただけたら、1クリックなのでSNSフォローしてもらえると嬉しいです🦈