概要
JavaScriptには、ロケールに応じた日付・数値・通貨などを表示するための強力な組み込みAPIが存在する。
それが Intl（Internationalization）だ。
- 日付を「YYYY/MM/DD」だけでなく、各国の文化に沿って表示したい
- 通貨を国別にフォーマットし、記号・小数点を正しく処理したい
- 数値の区切りや丸め、単位表現を制御したい
- 名前の並び順をロケールに応じて柔軟に変更したい
こういった要件に対して、Intlは実装コストを抑えつつ高品質な表現を可能にする。
対象環境
ES2020 以降（Node.js / モダンブラウザ）
Intl API 全体の構成
| API | 用途 |
|---|---|
Intl.DateTimeFormat |
日時フォーマット |
Intl.NumberFormat |
数値・通貨・単位の表現 |
Intl.Collator |
文字列の並び順比較 |
Intl.RelativeTimeFormat |
「1分前」「2日後」など |
Intl.ListFormat |
配列の結合（A、B、およびC） |
DateTimeFormat：日付を文化的に表現する
const date = new Date('2024-03-30T12:00:00');
const formatted = new Intl.DateTimeFormat('ja-JP', {
year: 'numeric',
month: 'long',
day: 'numeric',
weekday: 'long'
}).format(date);
console.log(formatted); // 2024年3月30日土曜日
✅ 対応例
| ロケール | 出力 |
|---|---|
'en-US' |
March 30, 2024, Saturday |
'fr-FR' |
samedi 30 mars 2024 |
'zh-CN' |
2024年3月30日星期六 |
NumberFormat：数値・通貨・単位の制御
✅ 数値フォーマット
const nf = new Intl.NumberFormat('en-US');
nf.format(1234567.89); // "1,234,567.89"
✅ 通貨フォーマット
const yen = new Intl.NumberFormat('ja-JP', {
style: 'currency',
currency: 'JPY'
});
console.log(yen.format(1200)); // "￥1,200"
✅ 単位付き数値
const temp = new Intl.NumberFormat('en-US', {
style: 'unit',
unit: 'celsius'
});
console.log(temp.format(22)); // "22°C"
RelativeTimeFormat：「〜前」「〜後」
const rtf = new Intl.RelativeTimeFormat('ja', { numeric: 'auto' });
console.log(rtf.format(-1, 'day')); // "昨日"
console.log(rtf.format(3, 'week')); // "3週間後"
ListFormat：配列を自然言語で表現
const lf = new Intl.ListFormat('ja', { type: 'conjunction' });
lf.format(['りんご', 'バナナ', 'みかん']); // "りんご、バナナ、およびみかん"
Collator：文字列の並び順比較
const names = ['たなか', 'サトウ', 'あべ'];
names.sort(new Intl.Collator('ja-JP').compare);
console.log(names); // ['あべ', 'サトウ', 'たなか']
→ ✅ アルファベット・ひらがな・カタカナのロケールごとの比較ロジックを自動処理
設計判断フロー
| 目的 | 使用すべきIntl API |
|---|---|
| 日時表示 | Intl.DateTimeFormat |
| 金額・数値 | Intl.NumberFormat |
| 「1時間前」「3日後」など | Intl.RelativeTimeFormat |
| 名前や用語のソート | Intl.Collator |
| 配列の自然言語化 | Intl.ListFormat |
よくあるミスと注意点
❌ Intlは環境依存のため、一部ロケールに未対応な場合あり
→ ✅ Intl.supportedLocalesOf() で確認可能
Intl.supportedLocalesOf(['fr-FR', 'de-DE', 'xx-YY']);
❌ 通貨や単位の記号は自動調整されるため、自前で文字列を付け足さない
結語
Intl は**“美しく正確な出力”を、わずかな構文で達成できる**構文的洗練の結晶である。
- 環境に依存しない統一フォーマット
- グローバル対応の簡素化
- UIの言語整合性の確保
- 書き捨てではなく、設計された表示
国際化は、グローバルサービスだけの課題ではない。
“ユーザーに届く言葉で、誤解なく伝える”ことが設計の責任である。
Intl を知ることは、コードの言語的表現力を最大化するための第一歩だ。