ts-intl
チャプター:Web Intl フォーマッター

Web Intl フォーマッターとキャッシュ

Intl.NumberFormatIntl.DateTimeFormat を頻繁にインスタンス化するとパフォーマンスに影響します。ts-intl は Web 標準 Intl API をラップし、言語ごとのキャッシュ機能を提供します。

フォーマッターの取得

方法 1: createI18ngetFormatter(推奨)

グローバル設定で定義されたプリセットフォーマット、タイムゾーン、エラーハンドラを継承します:

import { createI18n } from "@aaakul/ts-intl";

export const { getTranslations, getFormatter } = createI18n({
  defaultLanguage: "ja-JP",
  formats: {
    number: {
      jpy: { style: "currency", currency: "JPY" },
      compact: { notation: "compact" },
    },
    dateTime: {
      short: { dateStyle: "short" },
    },
  },
  messages: {
    "ja-JP": {},
  },
});

const formatter = getFormatter("ja-JP");

方法 2: 独立した createFormatter(options)

完全な i18n 辞書を必要としない独立したユーティリティ関数の作成に適しています:

import { createFormatter } from "@aaakul/ts-intl";

const formatter = createFormatter({
  locale: "ja-JP",
  formats: {
    number: { jpy: { style: "currency", currency: "JPY" } },
  },
});

主な機能

数値と通貨のフォーマット

formatter.number(1234567.89);
// "1,234,567.89"

formatter.number(2500, "jpy");
// "¥2,500"

formatter.number(1200000, "compact");
// "120万"

日付と時刻

formatter.dateTime(new Date(), { dateStyle: "long" });
// "2026年9月18日"

formatter.dateTimeRange(new Date("2026-09-01"), new Date("2026-09-05"));
// "2026/09/01~2026/09/05"

相対時間フォーマット

時間差から適切な単位を判定します:

const twoHoursAgo = new Date(Date.now() - 2 * 60 * 60 * 1000);
formatter.relativeTime(twoHoursAgo);
// "2 時間前"

リストと表示名フォーマット

formatter.list(["リンゴ", "バナナ", "オレンジ"]);
// "リンゴ、バナナ、オレンジ"

formatter.displayName("en-US", { type: "language" });
// "アメリカ英語"