グローバルなオーディエンスにリーチする Web アプリケーションは、言語、地域、スクリプト、通貨の表示名をさまざまな言語で表示する必要があります。これらの名前の翻訳には、Unicode CLDR で入手可能なデータが必要です。データをアプリケーションの一部としてパッケージ化すると、開発者の時間にコストがかかります。ユーザーは言語名と地域名の一貫した翻訳を好む可能性が高く、そのデータを世界の地政学的出来事に合わせて最新の状態に保つには、継続的なメンテナンスが必要です。
幸いなことに、ほとんどの JavaScript ランタイムは、まさにその翻訳データをすでに提供しており、最新の状態に保っています。新しい Intl.DisplayNames API により、JavaScript 開発者はこれらの翻訳に直接アクセスできるようになり、アプリケーションはローカライズされた名前をより簡単に表示できるようになります。
使用例 #
次の例は、ISO-3166 2 文字の国コードを使用して、英語で地域名を取得するための Intl.DisplayNames オブジェクトを作成する方法を示しています。
const regionNames = new Intl.DisplayNames(['en'], { type: 'region' });
regionNames.of('US');
// → 'United States'
regionNames.of('BA');
// → 'Bosnia & Herzegovina'
regionNames.of('MM');
// → 'Myanmar (Burma)'次の例では、Unicode の言語識別子文法を使用して、繁体字中国語で言語名を取得しています。
const languageNames = new Intl.DisplayNames(['zh-Hant'], { type: 'language' });
languageNames.of('fr');
// → '法文'
languageNames.of('zh');
// → '中文'
languageNames.of('de');
// → '德文'次の例では、ISO-4217 3 文字の通貨コードを使用して、簡体字中国語で通貨名を取得しています。単数形と複数形が異なる言語では、通貨名は単数形です。複数形の場合は、Intl.NumberFormat を使用できます。
const currencyNames = new Intl.DisplayNames(['zh-Hans'], {type: 'currency'});
currencyNames.of('USD');
// → '美元'
currencyNames.of('EUR');
// → '欧元'
currencyNames.of('JPY');
// → '日元'
currencyNames.of('CNY');
// → '人民币'次の例は、ISO-15924 4 文字のスクリプトコードを使用して、英語で最後にサポートされているタイプであるスクリプトを示しています。
const scriptNames = new Intl.DisplayNames(['en'], { type: 'script' });
scriptNames.of('Latn');
// → 'Latin'
scriptNames.of('Arab');
// → 'Arabic'
scriptNames.of('Kana');
// → 'Katakana'より高度な使用法については、2 番目の options パラメーターは style プロパティもサポートします。style プロパティは表示名の幅に対応し、"long"、"short"、または "narrow" のいずれかになります。異なるスタイルの値が常に異なるとは限りません。デフォルトは "long" です。
const longLanguageNames = new Intl.DisplayNames(['en'], { type: 'language' });
longLanguageNames.of('en-US');
// → 'American English'
const shortLanguageNames = new Intl.DisplayNames(['en'], { type: 'language', style: 'short' });
shortLanguageNames.of('en-US');
// → 'US English'
const narrowLanguageNames = new Intl.DisplayNames(['en'], { type: 'language', style: 'narrow' });
narrowLanguageNames.of('en-US');
// → 'US English'完全な API #
Intl.DisplayNames の完全な API は次のとおりです。
Intl.DisplayNames(locales, options)
Intl.DisplayNames.prototype.of( code )コンストラクターは、他の Intl API と一貫性があります。最初の引数は、ロケールリストであり、2 番目のパラメーターは、localeMatcher、type、および style プロパティを受け取る options パラメーターです。
"localeMatcher" プロパティは、他の Intl API と同じように扱われます。type プロパティは、"region"、"language"、"currency"、または "script" にすることができます。style プロパティは、"long"、"short"、または "narrow" にすることができ、デフォルトは "long" です。
Intl.DisplayNames.prototype.of( code ) は、インスタンスがどのように構築されたかの type に応じて、次の形式を想定しています。
typeが"region"の場合、codeは、ISO-3166 2 文字の国コードまたは UN M49 3 桁の地域コードのいずれかである必要があります。typeが"language"の場合、codeは Unicode の言語識別子文法に準拠する必要があります。typeが"currency"の場合、codeは ISO-4217 3 文字の通貨コードである必要があります。typeが"script"の場合、codeは ISO-15924 4 文字のスクリプトコードである必要があります。
結論 #
他の Intl API と同様に、Intl.DisplayNames がより広く利用可能になるにつれて、ライブラリとアプリケーションは、ネイティブ機能を使用することを優先して、独自の翻訳データのパッケージ化と提供をやめることを選択するでしょう。