JavaScriptで小数点の桁数を固定したい場合、`toFixed()`メソッドを使用することで簡単に実現できます。この記事では、`toFixed()`メソッドの基本的な使い方から実践的な使用例まで、分かりやすく解説します。

toFixed()メソッドの基本

`toFixed()`は数値を指定した小数点以下の桁数に固定し、文字列として返すメソッドです。

const number = 3.14159;
console.log(number.toFixed(2)); // "3.14"

基本的な使い方

構文

numObj.toFixed([digits])
  • `digits`: 小数点以下の桁数(0から20の間の値)
  • 省略した場合は0として扱われます

使用例

const price = 123.456;

console.log(price.toFixed(0)); // "123"
console.log(price.toFixed(1)); // "123.5"
console.log(price.toFixed(2)); // "123.46"
console.log(price.toFixed(3)); // "123.456"

注意点

1. 戻り値が文字列型になる

const num = 3.14;
const fixed = num.toFixed(1);
console.log(typeof fixed); // "string"

2. 四捨五入される

console.log(3.145.toFixed(2)); // "3.15"
console.log(3.144.toFixed(2)); // "3.14"

3. 指定桁数が足りない場合は0で埋められる

console.log(3.1.toFixed(3)); // "3.100"

実践的な使用例

金額表示での活用

const price = 1234.5678;
const formattedPrice = `¥${price.toFixed(2)}`;
console.log(formattedPrice); // "¥1234.57"

計算結果の丸め処理

const result = 10 / 3;
console.log(result.toFixed(2)); // "3.33"

エラー対処

数値以外に対する使用

// エラーになるケース
"123.45".toFixed(2); // エラー

// 正しい使い方
Number("123.45").toFixed(2); // "123.45"

範囲外の桁数指定

const num = 123.456;
// エラーになるケース
num.toFixed(-1); // RangeError
num.toFixed(21); // RangeError

まとめ

`toFixed()`メソッドは、JavaScriptで小数点以下の桁数を制御する際に非常に便利なメソッドです。特に金額表示や計算結果の表示など、実務でよく使用されるシーンで活躍します。ただし、戻り値が文字列型になることや、四捨五入される仕様については注意が必要です。

以上が`toFixed()`メソッドの基本的な使い方と注意点です。実際のプロジェクトで活用する際は、これらの特徴を踏まえた上で適切に使用しましょう。