キーポイント
この記事は、Julian Motz、Panayiotis Velisarakos、Vildan Softic、Tim Severienによってレビューされました。 SitePointコンテンツを最高の状態にしてくれたすべてのSitePointピアレビューアに感謝します！
Internationalization（
i18n とも呼ばれます）は、特定のローカル言語と文化に簡単に適応できるように、製品とサービスを作成または変換するプロセスです。ローカリゼーション（l10nとも呼ばれます）は、特定の地域または言語の国際化ソフトウェアを調整するプロセスです。言い換えれば、国際化とは、ソフトウェアが複数の文化（通貨形式、日付形式など）をサポートできるようにするプロセスであり、ローカライズは1つ以上の文化を実装するプロセスです。
これらの2つのプロセスは、さまざまな国に関心のある企業でしばしば採用されていますが、自分のウェブサイトで作業している個々の開発者にも役立つ可能性があります。たとえば、おそらく私はイタリア人であり、ウェブサイトを所有しています。私のウェブサイトは現在英語ですが、私はそれを国際化して、それをイタリア語にローカライズすることを決定するかもしれません。これは、ネイティブのイタリア語で英語に不慣れな人にとっては非常に有益です。
この記事では、国際化とローカリゼーションのためにjQueryチームの一部のメンバーによって開発されたJavaScriptライブラリであるGlobalizeを紹介します。この記事で示されているすべてのコードスニペットは、GitHubリポジトリにあります。しかし、グローバル化を掘り下げる前に、プロジェクトリーダーのラファエル・ザビエル・デ・スーザの言葉でi18nについてのこの短い紹介を終わらせたいと思います：
開発者は、i18nが英語以外の言語への翻訳についてであると考えています。 I18Nは、現在のアプリケーションを複数の国または市場に拡張する必要があります。私は、i18nが「話す」ことについてであると説明しようとしてきました。すべてのアプリは、ある時点でユーザーと「通信」する必要があります。ユーザーと話をするには、アプリケーションには複数のサポート、性別の変動、日付の書式設定、デジタルフォーマット、通貨のフォーマットが必要になる場合があります。英語であっても、仕事を正しく行うのは難しい場合があります。グローバル化とは何ですか？
Globalize Unicode ConsortiumベースのUnicode Consortium Data Repository（CLDR）は、利用可能なロケールデータの最大かつ最も包括的な標準リポジトリです。したがって、ロケールデータを埋め込むライブラリとは異なり、Globalizeを使用する場合、最新のCLDRデータを常に簡単に使用できます。
このライブラリの主な関数には、
：が含まれます
デジタルフォーマットと解析
これは皆さんにとって驚くかもしれませんが、JavaScriptは国際化API（ECMA-402とも呼ばれる）を通じて国際化に対するネイティブサポートを提供します。 INTLオブジェクトは、国際化されたAPIの名前空間として機能するウィンドウオブジェクトで利用可能なオブジェクトです。このAPIは現在、特定の言語の文字列を比較するだけでなく、数字と日付をフォーマットする方法を提供します。
国際的なAPIの存在を知っているので、Globalizeが舞台裏でそれを使用していると思うかもしれません。このアプローチは、日付と数のフォーマットのパフォーマンスを確実に改善します。ただし、ブラウザ間では低くて一貫性のないサポートのため、ライブラリはそれを使用していません。
グローバル化について議論し続ける前に、国際的なAPIを体験してほしい。
私が示す最初の例は、国際APIを使用して、複数のロケールで日付をフォーマットすることです：it、us、およびgb。
// 2016 年 6 月 30 日
var date = new Date(2016, 5, 30);
// "30/6/2016"
console.log(new Intl.DateTimeFormat('it-IT').format(date));
// "6/30/2016"
console.log(new Intl.DateTimeFormat('en-US').format(date));
// "30/06/2016"
console.log(new Intl.DateTimeFormat('en-GB').format(date));上記のコードはJSBINとしても使用できます。
フォーマット番号
この2番目のコードスニペット（JSBINとして使用することもできます）の出力を見ると、イタリアでは、米国と英国よりも数字の異なる形式があることに気付くことができます。
前述のように、このAPIのサポートは低いですが、使用したい場合は、アプリケーションでこのポリフィルを使用できます。var number = 1302.93;
// "1.302,93"
console.log(new Intl.NumberFormat('it-IT').format(number));
// "1,302.93"
console.log(new Intl.NumberFormat('us-US').format(number));
// "1,302.93"
console.log(new Intl.NumberFormat('en-GB').format(number));今度は、国際化とローカリゼーションがどのように機能するかをよりよく理解したので、グローバル化について議論しましょう。
インストールしてグローバル化
を使用しますGlobalizeは、NPM：
を通じて簡単にインストールできます注：次の例では、ノードが使用されていることを前提としています。ブラウザでグローバル化を使用することに興味がある場合は、プロジェクトのホームページの例から始めることをお勧めします。 Webpackの例により、すぐに起きて実行が簡単になります。
npm install globalize cldr-data --save
フォーマット日
最初の例は、次のように実装できます
// 2016 年 6 月 30 日
var date = new Date(2016, 5, 30);
// "30/6/2016"
console.log(new Intl.DateTimeFormat('it-IT').format(date));
// "6/30/2016"
console.log(new Intl.DateTimeFormat('en-US').format(date));
// "30/06/2016"
console.log(new Intl.DateTimeFormat('en-GB').format(date));それは単純ですが、上記のコードではいくつかのトピックをカバーできます。 Globalizeを最初に使用したとき、CLDRデータに使用される言語コードの一部が2文字しか使用していないことが少し奇妙に感じました。一貫性を維持するために、すべてのロケールに、短いバージョン（「IT」や「EN」など）ではなく、ISO 3166標準（「IT-IT」および「EN-US」など）の完全なバージョンを必要とします。イタリア人がイタリア語であると仮定するのは合理的であるように思われますが（結局イタリア語はイタリアで生まれた）、これは英語を混乱させています。 「en」とは、英国の英語ではなく、アメリカの英語を意味します。あなたが私と同じ間違いを犯さないようにしたい場合は、このテーブルをチェックすることをお勧めします。
概要を示す価値のある別の概念は、補足法全体（コードの3番目のステートメント）です。これにより、国またはロケールデータの補足情報を含むすべてのファイルがロードされます。たとえば、電話国コード（イタリアの39）、人口、いくつかのよく知られている略語、他の国の通貨の綴り方など
私が紹介したい最後のポイントは、4番目のステートメントであり、ここではAvereMainforメソッドを呼び出します。これにより、必要な国（イタリア、米国、および英国の例の例）にロケールデータを読み込むことができます。
数字をフォーマットするために、GlobalizeはFormatNumberメソッドを提供します。このメソッドの署名は
ですvar number = 1302.93;
// "1.302,93"
console.log(new Intl.NumberFormat('it-IT').format(number));
// "1,302.93"
console.log(new Intl.NumberFormat('us-US').format(number));
// "1,302.93"
console.log(new Intl.NumberFormat('en-GB').format(number));値がフォーマットされる番号である場合、オプションはカスタムメソッドの返品値のオブジェクトです。指定できるオプションのいくつかの例は次のとおりです
フォーマットナンバーメソッドについて詳しく学んだので、実際にどのように適用されるかを見てみましょう。
npm install globalize cldr-data --save
数字を分析します のフォーマット
Globalizeは、この記事で説明していない他の多くの方法を提供します。ただし、ここに示されているトピックは、始めるのに役立つ十分な情報を提供する必要があります。さらに、このライブラリのドキュメントは非常に詳細です。
この記事の第2部では、jQueryチームが国際化とローカリゼーションのために開発したJavaScriptライブラリであるGlobalizeを紹介します。ライブラリは非常に強力であり、プロジェクトを国際化するために必要なすべての方法が付属しています。たとえば、数字、フォーマット日、フォーマット通貨値などです。図書館が時間を節約していると思う場合は、プロジェクトに貢献することで、お気軽にお返事をしてください。
JavaScript（i18n） FAQ（FAQ）
i18nは、開発者がアプリケーションのコードからロケール固有の文字列またはメッセージを外部化できるようにすることで機能します。これらの文字列は、多くの場合、リソースパッケージと呼ばれる別のファイルに保存されます。各リソースパッケージは、特定のロケールに対応しています。アプリケーションが実行されると、ユーザーのロケールを認識し、対応するリソースパッケージをロードします。これにより、アプリケーションはユーザーの優先言語でメッセージとコンテンツを表示できます。 JavaScriptにi18nを実装するために利用できるライブラリがいくつかあります。最も人気のあるライブラリには、I18Next、I18N-JS、Globalizeが含まれます。これらのライブラリは、言語検出、複数形、数値形式などの国際化を促進するためのさまざまな機能を提供します。また、React、Angular、Vue.jsなどのさまざまなフレームワークをサポートしているため、Web開発のための汎用性の高いツールになります。 JavaScriptプロジェクトでI18N-JSライブラリを使用するには、最初にNPMまたはYARNを使用してインストールする必要があります。インストールしたら、プロジェクトにインポートして、その機能の使用を開始できます。このライブラリは、文字列を翻訳し、数値と日付をフォーマットする機能を提供します。また、翻訳を別のJSONファイルに定義することもできます。これは、ライブラリがユーザーのロケールに従ってこれらのファイルをロードできます。 はい、i18nはライブラリを使用せずにJavaScriptに実装できます。これは、コードからロケール固有の文字列を手動で外部化し、個別のファイルに保存することで実行できます。ただし、より大きなアプリケーションの場合、このアプローチは時間がかかり、複雑になる場合があります。ライブラリを使用してプロセスを簡素化し、アプリケーションの国際化を強化する追加機能を提供します。
i18nで右から左（RTL）言語を処理する方法は？
通常、L10Nと略される 以上がJavaScriptに国際化（I18N）を実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。// 包含 Globalize 库
var Globalize = require('globalize');
// 包含 CLDR 数据
var cldrData = require('cldr-data');
// 加载补充数据
Globalize.load(cldrData.entireSupplemental());
// 加载指定语言环境的数据
Globalize.load(cldrData.entireMainFor('it', 'en', 'en-GB'));
// 2016 年 6 月 30 日
var date = new Date(2016, 5, 30);
// "30/6/2016"
console.log(Globalize('it').formatDate(date));
// "6/30/2016"
console.log(Globalize('en').formatDate(date));
// "30/06/2016"
console.log(Globalize('en-GB').formatDate(date));
相対日付// 2016 年 6 月 30 日
var date = new Date(2016, 5, 30);
// "30/6/2016"
console.log(new Intl.DateTimeFormat('it-IT').format(date));
// "6/30/2016"
console.log(new Intl.DateTimeFormat('en-US').format(date));
// "30/06/2016"
console.log(new Intl.DateTimeFormat('en-GB').format(date));結論
この記事では、国際化とローカリゼーションが何であるか、そして製品の市場を拡大するために非常に重要である理由について説明します。いくつかのサポートされた機能に言及して、国際化されたAPIを簡単に紹介しました。その後、それらの使用例をいくつか示しました。
多くの場合、I18Nと略される国際化は、特にグローバルな視聴者向けのアプリケーションを作成する場合、Web開発の重要な側面です。複数の言語と地域の違いをサポートするために、ウェブサイトまたはアプリケーションを準備することが含まれます。これは、Web開発で広く使用されている言語であるJavaScriptで特に重要です。 JavaScriptにI18Nを実装することにより、開発者はさまざまなユーザーグループを満たすアプリケーションを作成し、ユーザーエクスペリエンスとアクセシビリティを向上させることができます。また、アプリケーションのローカライズにも役立ち、アプリケーションのカバレッジと使いやすさを大幅に改善できます。
JavaScriptではI18Nはどのように機能しますか？
JavaScriptの JavaScriptにi18nを実装するための人気のあるライブラリは何ですか？
JavaScriptプロジェクトでi18n-jsライブラリを使用する方法は？
ライブラリを使用せずにJavaScriptにi18nを実装できますか？
i18nの複数形に対処する方法は？
I18Nでの複数形成の処分は、異なる言語で異なる複数ルールのために難しい場合があります。ただし、多くのI18Nライブラリは、多元化を処理する能力を提供します。たとえば、I18N-JSライブラリは、ユーザーのロケールに従って複数形を処理できる複数形関数を提供します。
アプリケーションの国際化をテストするには、アプリケーションがユーザーのロケールに基づいて異なる言語のコンテンツとフォーマットを正しく表示するかどうかを確認することが含まれます。これは、ブラウザ内のロケール設定を手動で変更するか、自動テストツールを使用することで実行できます。また、翻訳の不足や誤った複数形式など、エッジケースを確認することも重要です。
日付と数の形式は、ロケール間でかなり異なる場合があります。多くのI18Nライブラリは、ユーザーのロケールに従って日付と数値をフォーマットする機能を提供します。たとえば、I18N-JSライブラリは、これらのタスクを処理できるフォーマットデートおよびフォーマンバル機能を提供します。
I18Nを使用したローカリゼーション（L10N）を処理する方法は？
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
