toLocaleString を初心者向けにやさしく、例題つきで詳しく説明します。目的 → 基本の使い方 → オプション（実務でよく使う設定）→ 実例コード → 注意点 → 練習問題 の順で進めます。
概要
toLocaleString は数値を「その国・地域の見た目」で文字列に変換するメソッドです。
例えば日本だと 1,234.56、ドイツだと 1.234,56 のように 桁区切りや小数点の記号が国ごとに違うので、それを自動で合わせてくれます。通貨表示（¥, $）やパーセント表示にも使えます。
基本の構文
数値.toLocaleString([ロケール, オプション])
ロケール（例：'ja-JP','en-US','de-DE'）は省略可能。省略すると実行環境のデフォルトロケールが使われます。オプションはオブジェクトで、表示方法（通貨・桁数・グループ化の有無等）を細かく指定できます。
まずはシンプルな例
const n = 8242.56;
console.log(n.toLocaleString()); // 例: "8,242.56"（環境による）
console.log(n.toLocaleString('ja-JP')); // "8,242.56"
console.log(n.toLocaleString('de-DE')); // "8.242,56"
console.log(n.toLocaleString('ru-RU')); // "8 242,56"（スペースで区切る国もある）
→ ロケールを変えるだけで、桁区切り記号や小数点記号が切り替わるのが分かります。
よく使うオプション（実務で頻出）
toLocaleString のオプションはかなり豊富ですが、初心者がよく使うものを絞って紹介します。
style：'decimal'（数値／デフォルト）、'currency'（通貨）,'percent'（パーセント）currency：style: 'currency'のときに通貨コード（'JPY','USD','EUR'）を指定minimumFractionDigits/maximumFractionDigits：小数点以下の最小/最大桁数を指定useGrouping：千区切り（グループ化）を使うかどうか（true/false）
例：
const price = 1234.5;
// 通貨表示（日本円）
console.log(price.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }));
// => "￥1,235" （日本円は小数点を表示しない丸めが多い）
// 通貨表示（米ドル）
console.log(price.toLocaleString('en-US', { style: 'currency', currency: 'USD' }));
// => "$1,234.50"
// 小数桁を固定して表示
console.log((0.1234).toLocaleString('en-US', { style: 'percent', minimumFractionDigits: 1 }));
// => "12.3%"
// 小数点以下を2桁に固定（丸めあり）
console.log(price.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 }));
// => "1,234.50"
// グループ化をオフにする（千区切りなし）
console.log(price.toLocaleString('en-US', { useGrouping: false }));
// => "1234.5"
実践的な例
const value = 9876543.21;
// 日本の通貨（JPY）
console.log(value.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }));
// => "￥9,876,543"
// 米ドル（小数2桁）
console.log(value.toLocaleString('en-US', { style: 'currency', currency: 'USD', minimumFractionDigits: 2 }));
// => "$9,876,543.21"
// ドイツの通常表示（小数2桁）
console.log(value.toLocaleString('de-DE', { minimumFractionDigits: 2, maximumFractionDigits: 2 }));
// => "9.876.543,21"
// パーセント表示（例: 0.85 -> 85%）
const ratio = 0.85;
console.log(ratio.toLocaleString('en-US', { style: 'percent', minimumFractionDigits: 0 }));
// => "85%"
数値リテラルに注意（よくあるつまずき）
1000.toLocaleString(); // 構文エラーになることがある
→ 整数リテラルの直後にピリオドが来ると JS の構文で混乱するため、次のどちらを使います：
(1000).toLocaleString();
1000..toLocaleString(); // 意図的にピリオドを二回
1000 .toLocaleString(); // 数字の後にスペースを入れる
ラウンド（四捨五入）について
toLocaleString の minimumFractionDigits / maximumFractionDigits を指定すると表示の際に**丸め（四捨五入）**が行われます。内部の数値は変わらない（文字列化時の表示が丸められる）点に注意。
例：
const x = 2.3456;
console.log(x.toLocaleString('en-US', { maximumFractionDigits: 2 })); // "2.35"
実用的なユーティリティ関数
function formatCurrency(value, locale='ja-JP', currency='JPY') {
return value.toLocaleString(locale, { style: 'currency', currency });
}
console.log(formatCurrency(1234.56)); // "￥1,235"
console.log(formatCurrency(1234.56, 'en-US', 'USD')); // "$1,234.56"
注意点・落とし穴
toLocaleStringは見た目を整えるための関数であって、数値の精度を保証する計算用ではありません。計算は数値で行い、表示時にtoLocaleStringを使いましょう。- 実行環境（ブラウザや Node.js のバージョン）によってサポートされるロケールや挙動がわずかに異なることがあります。主要ロケールは大抵サポートされていますが、古い環境では想定外の出力になる場合があります。
- 通貨表示では
currencyDisplay（'symbol'|'code'|'name'）で記号の出し方を変えられます（例:USDか$かUS dollarsか）。必要なら使ってみてください。
練習問題
- 数値
12345.678をドイツ風（de-DE）に小数2桁で表示してください。答え:console.log((12345.678).toLocaleString('de-DE', { minimumFractionDigits:2, maximumFractionDigits:2 }));→ 出力:"12.345,68" 0.075をパーセントで表示し、小数1桁で出すとどうなりますか？console.log((0.075).toLocaleString('en-US', { style:'percent', minimumFractionDigits:1 }));→"7.5%"- 金額
5000を米ドル通貨表示で桁区切りあり、小数2桁で出すコードと出力を示してください。console.log((5000).toLocaleString('en-US', { style: 'currency', currency: 'USD', minimumFractionDigits:2 }));→"$5,000.00"
まとめ
toLocaleStringはユーザーに読みやすい形で数値を見せるための強力なツール。- ロケールを変えるだけで桁区切りや小数表記、通貨記号の表示方法が簡単に切り替えられる。
style,currency,minimumFractionDigitsなどのオプションを覚えると実務で便利。- 計算は数値で正確に行い、表示のタイミングで
toLocaleStringを使うのがベストプラクティス。