JavaScriptのIntl.DisplayNamesで国名を表示する

Intl.DisplayNames API

Intl.DisplayNames APIは、外部ライブラリや翻訳ファイルを必要とせずにISOコードを任意のサポート言語の人間が読める名前に変換するJavaScriptの組み込み機能です。

基本的な使い方

// 英語の国名
const enNames = new Intl.DisplayNames(['en'], { type: 'region' });
console.log(enNames.of('JP')); // "Japan"

// 日本語の国名
const jaNames = new Intl.DisplayNames(['ja'], { type: 'region' });
console.log(jaNames.of('US')); // "アメリカ合衆国"
console.log(jaNames.of('JP')); // "日本"

国セレクターの構築

function getCountryOptions(locale, countryCodes) {
  const displayNames = new Intl.DisplayNames([locale], { type: 'region' });
  return countryCodes
    .map(code => ({
      value: code,
      label: displayNames.of(code) || code,
    }))
    .sort((a, b) => a.label.localeCompare(b.label, locale));
}

ブラウザとランタイムのサポート

Chrome 81+、Firefox 86+、Safari 14.1+、Node.js 12.0+で完全サポートされています。