英語は世界で最も広く話されている言語ですが、英語を話すのは7人に1人だけです。これは3億7,900万人の第一言語（母国語）ですが、マンダリンを話す人は9億1,700万人、スペイン語を話す4億6,000万人、ヒンディー語を話す3億4100万人がいます。
英語を話すユーザーの多くは、新興市場に住んでおり、インターネットの成長が指数関数的に増加しています。 Webアプリケーションをグローバルに翻訳できる場合、潜在的なターゲット市場が700％増加する可能性があります！
JavaScript Internationalized API（I18Nとも呼ばれます）を使用すると、Webページとアプリケーションを設計して、異なる言語を話すユーザーのニーズに簡単に適応できるようにします。
この記事では、APIが提供するさまざまな方法と、より多くの国際的な視聴者に到達するためにコードにそれらを実装する方法について説明します。キーポイント
Intl.DateTimeFormat()などの関数が含まれます。 Intl.NumberFormat()
相対的な時間書式設定（Intl.RelativeTimeFormatその強力な機能にもかかわらず、JavaScript INTL APIは、言語と文化の違いを効果的に処理し、アプリケーションが真に国際化されるようにするために慎重に実装する必要があります。 Intl.PluralRules
ラテン語ベースの言語は、表面上で類似している場合があります。たとえば、名前、電子メール、日付を要求するフォームは、次のように翻訳されます。 スペイン語：nombre、email、fecha
フランス語：nom、電子メール、日付
"name"
を動的に置き換えます。残念ながら、これはユーザーインターフェイスの問題が表示され始める場所です。混乱という用語
日付を「12/03/24」と表示することを検討してください。それは次のように解釈されます：
米国、英国、カナダ、中国、日本の人々は、それを「1000」と解釈します スペイン、フランス、ドイツ、ロシアの人々は、これらの国の小数がコンマで分離されているため、「1つ（ポイントゼロ）」と解釈するでしょう。
英語だけでも、状況は複雑になる可能性があります。 「1,000メートル」という用語は、次のことを意味します
javascript intl api
format（）メソッドに加えて、一部のオブジェクトは次の方法もサポートしています。
すべてのINTLオブジェクトには、ロケールパラメーターが必要です。これは、識別する文字列です
文字列を使用することに加えて、intl.localeオブジェクトを使用して、米国英語などのロケールを12時間形式で構築することもできます。
これは、別のINTLコンストラクターで使用できます。たとえば、
<code><label> for="name"></label>{{ NAME }}>
</code>ロケールが定義されていない場合、デバイスの現在の言語と地域設定が使用されます。たとえば、
<code>if (window.Intl) {
// Intl 受支持
}
</code>これは、米国に設定されたデバイスで「5/4/2022」、英国に設定されたデバイスで「04/05/2022」を返します。
<code>const dateFormatter = new Intl.DateTimeFormat('en-US');
</code>次のツールは、intl.dateTimeFormat（）を使用してフォーマットされた日付と時間の例を示しています（言語や地域がリストされていない場合は、深く申し訳ありません！）：
。
コンストラクターはロケールとオプションオブジェクトを渡します。これには多くの可能なプロパティがありますが、DatestyleやTimestyleを超える必要はほとんどありません。
Intl.DateTimeFormat()（ここではテーブルですが、テーブルを直接作成できないため、テキストの説明のみを提供できます。）テーブルには、
、、
、>、Intl.DateTimeFormat()、dateStyle、timeStyle、calendar、dayPeriod、numberingSystem、localeMatcher、timeZone、hour12、、hourCycle、formatMatcher、weekday、era、year、month、day、hour、minute、secondなど。 timeZoneName
<code>const valentinesDay = dateFormatter.format( new Date('2022-02-14') );
// 返回美国格式“2/14/2022”
const starwarsDay = dateFormatter.format( new Date('2022-05-04') );
// 返回美国格式“5/4/2022”
</code>
<code>const starwarsDay = new Intl.DateTimeFormat('en-US').format( new Date('2022-05-04') );
</code>intl.relativetimeformat（）オブジェクトは、このモーメントに比べて期間を表示できます。オプションオブジェクトにはオプションが少なくなります：
（ここではテーブルですが、テーブルを直接作成できないため、テキストの説明のみを提供できます。）テーブルには、Intl.RelativeTimeFormat()、localeMatcher、、numeric、style>待ってください。
format（）メソッドは、値と単位を渡します：「year "、" Quarter "、" month "、" week "、" day "、" hour "、" minute "、または" second "。例：
<code><label> for="name"></label>{{ NAME }}>
</code>次のツールは、intl.numberformat（）を使用した数値、通貨、パーセンテージ、および測定単位のフォーマットの例を示しています。
（Codepenの例はここに埋め込む必要がありますが、外部リソースを直接埋め込むことができないため、テキストの説明のみを提供できます。）Codepenの例は、異なる地域の数字、通貨、パーセンテージ、ユニットをフォーマットする方法を示しています。さまざまなスタイル（小数、通貨、パーセント、単位）を含むを使用した言語、およびIntl.NumberFormat()、notation、currency、currencyDisplay、unit、unitDisplay、、useGrouping、minimumIntegerDigits、minimumFractionDigits、maximumFractionDigits、minimumSignificantDigits、maximumSignificantDigits、🎜>、
、
など。
Intl.NumberFormat()コンストラクターはロケールとオプションオブジェクトを渡します：numberingSystem
notation（ここではテーブルですが、テーブルを直接作成できないため、テキストの説明のみを提供できます。）テーブルには、style、currency、、currencyDisplay、currencySign>、unit、unitDisplay、useGrouping、minimumIntegerDigits、minimumFractionDigits、maximumFractionDigits、minimumSignificantDigits、maximumSignificantDigits、
、
、<code>if (window.Intl) {
// Intl 受支持
}
</code>例：
リストIntl.ListFormat()
typeintl.listformat（）オブジェクトは、一連のアイテムを言語に敏感なリストにフォーマットできます。英語では、これには通常、最後のアイテムの前に「または」または「または」を追加する必要があります。 style
（ここではテーブルですが、テーブルを直接作成できないため、テキストの説明のみを提供できます。）テーブルには、
、<code>const dateFormatter = new Intl.DateTimeFormat('en-US');
</code>複数 わずかに奇妙なintl.pluralrules（）オブジェクトは、複数のアイテムがある複数の敏感な言語ルールをサポートしています。オプションオブジェクトは、タイププロパティを次のように設定できます。
select（）メソッドは、数値の複数カテゴリを表す英語の文字列を返します（ゼロ、1、2、少数派、多数派、またはその他）。
例：
<code><label> for="name"></label>{{ NAME }}>
</code>最後に、intl.collator（）オブジェクトは、言語に敏感な文字列比較をサポートします。そのオプションオブジェクトは、次のプロパティを設定できます
（ここではテーブルですが、テーブルを直接作成できないため、テキストの説明のみを提供できます。）テーブルには、、Intl.Collator()、などcollation
numeric比較（）メソッドは2つの文字列を比較します。たとえば、
利益！
<code>if (window.Intl) {
// Intl 受支持
}
</code>これ自体は、国際的な聴衆にとってアプリケーションを容易にすることはできませんが、グローバルな流通に近い最初のステップです。 JavaScript Internationalization API（i18n）についての
FAQ（FAQ）<code>const dateFormatter = new Intl.DateTimeFormat('en-US');
</code>JavaScript Internationalization API（I18Nとも呼ばれます）は、言語に敏感な文字列比較、数値フォーマット、および日付と時刻のフォーマットを提供する組み込みのJavaScript APIです。これにより、開発者はさまざまな言語や文化的慣習をサポートすることにより、アプリケーションを国際化できます。これは、世界中で使用されるアプリケーションに特に役立ちます。さまざまな地域の言語と形式の規則に適応できるためです。
JavaScript i18nでデジタルフォーマットを処理する方法は？
JavaScript i18nで文字列比較を処理する方法は？
DateTimeFormat、Numberformat、またはCollatorオブジェクトを作成すると、ロケールをパラメーターとして指定できます。ロケールは、アメリカ英語の「en-us」やフランスで使用されているフランス語では「fr-fr」など、言語と地域を表す文字列です。ロケールが指定されていない場合、JavaScript環境のデフォルトのロケールが使用されます。
はい、DateTimeFormat、Numberformat、またはCollatorオブジェクトを作成するとき、アレイとして複数のロケールを指定できます。 JavaScript I18Nは、アレイでサポートする最初のロケールを使用します。これは、複数の地域で使用されるアプリケーションに非常に役立ちます。これにより、異なる地域の言語と形式の規則に適応することができます。
DateTimeFormat、Numberformat、またはCollatorオブジェクトを作成する場合、オプションオブジェクトを提供してJavaScript I18Nのフォーマットオプションをカスタマイズできます。オプションオブジェクトは、日付や数字の形式、文字列比較の感度など、フォーマットまたは比較の側面を指定できます。
はい、JavaScript I18Nは、他のJavaScript APIと組み合わせて使用できます。たとえば、DateTimeFormatオブジェクトを備えた日付オブジェクトを使用して日付をフォーマットするか、Numberformatオブジェクトを持つ番号オブジェクトを使用して数字をフォーマットすることもできます。これにより、JavaScriptの力を利用して、アプリケーションを国際化することができます。
ほとんどの最新のブラウザー（Chrome、Firefox、Safari、Edgeを含む）はJavaScript i18nをサポートしています。ただし、古いブラウザやモバイルブラウザではサポートされていない場合があります。ブラウザーサポートに関する最新情報については、Mozilla Developer Network（MDN）の互換性テーブルを表示できます。
公式のECMAScript International API仕様、Mozilla Developer Network（MDN）、およびさまざまなオンラインチュートリアルや記事からJavaScript I18Nの詳細をご覧ください。これらのリソースは、APIとその使用に関する詳細な情報、およびJavaScriptアプリケーションを国際化するための例とベストプラクティスを提供します。
以上がJavaScript Internationalization API（I18N）とは何ですか？の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
