キーポイント

• Internationalization（I18N）は、製品とサービスを作成または変換するプロセスであり、地元の言語や文化に適応できるようにします。ローカリゼーション（L10N）は、特定の地域または言語に対して國際化ソフトウェアを調(diào)整するプロセスです。
• Globalizeは、國際化とローカリゼーションのためにJQueryチームのメンバーによって開発されたJavaScriptライブラリです。公式のUnicode CLDR JSONデータを使用し、すべての主要なブラウザーをサポートし、デジタルフォーマットと解析、日付と時(shí)刻のフォーマットと解析、相対時(shí)間のフォーマット、通貨のフォーマット、メッセージフォーマット、複數(shù)のサポート、ユニットサポートなどの機(jī)能を提供します。
• JavaScriptは、國際化API（ECMA-402とも呼ばれる）を通じて、國際化に対するネイティブサポートを提供します。ただし、グローバル化は、ブラウザ間で低くて一貫性のないサポートのためにそれを使用しませんでした。
グローバル化は、NPMを介してインストールできます。NPMは、各機(jī)能にモジュールを提供し、開発者が必要なモジュールのみを使用できるようにします。ライブラリにロケールデータをホストまたは埋め込まないことにより、コードとコンテンツを分離します。
グローバル化を使用すると、開発者は日付、數(shù)値、通貨値、解析番號、および相対日付をフォーマットできます。このライブラリのドキュメントは、これらの機(jī)能やその他の機(jī)能の使用方法に関する詳細(xì)な情報(bào)を提供します。

この記事は、Julian Motz、Panayiotis Velisarakos、Vildan Softic、Tim Severienによってレビューされました。 SitePointコンテンツを最高の狀態(tài)にしてくれたすべてのSitePointピアレビューアに感謝します！

あなたが開発者であり、次のホット製品に取り組んでいると仮定します。顧客はあなたの製品が大好きで、すべてのソーシャルネットワークで非常に高い評価を受けています。さらに良いことに、CEOは新しい市場に拡大するために10,000,000ドルの資金を受け取ったばかりです。ただし、グローバルになる前に、さまざまな言語、通貨、日付形式などをサポートするために製品を更新する必要があります。どう思いますか？あなたとあなたのチームはこれを達(dá)成する責(zé)任があります。技術(shù)的な観點(diǎn)からは、ソフトウェアは國際化され、ローカライズされている必要があります。

Internationalization（

i18n とも呼ばれます）は、特定のローカル言語と文化に簡単に適応できるように、製品とサービスを作成または変換するプロセスです。ローカリゼーション（l10nとも呼ばれます）は、特定の地域または言語の國際化ソフトウェアを調(diào)整するプロセスです。言い換えれば、國際化とは、ソフトウェアが複數(shù)の文化（通貨形式、日付形式など）をサポートできるようにするプロセスであり、ローカライズは1つ以上の文化を?qū)g裝するプロセスです。

これらの2つのプロセスは、さまざまな國に関心のある企業(yè)でしばしば採用されていますが、自分のウェブサイトで作業(yè)している個(gè)々の開発者にも役立つ可能性があります。たとえば、おそらく私はイタリア人であり、ウェブサイトを所有しています。私のウェブサイトは現(xiàn)在英語ですが、私はそれを國際化して、それをイタリア語にローカライズすることを決定するかもしれません。これは、ネイティブのイタリア語で英語に不慣れな人にとっては非常に有益です。

この記事では、國際化とローカリゼーションのためにjQueryチームの一部のメンバーによって開発されたJavaScriptライブラリであるGlobalizeを紹介します。この記事で示されているすべてのコードスニペットは、GitHubリポジトリにあります。

しかし、グローバル化を掘り下げる前に、プロジェクトリーダーのラファエル?ザビエル?デ?スーザの言葉でi18nについてのこの短い紹介を終わらせたいと思います：

開発者は、i18nが英語以外の言語への翻訳についてであると考えています。 I18Nは、現(xiàn)在のアプリケーションを複數(shù)の國または市場に拡張する必要があります。私は、i18nが「話す」ことについてであると説明しようとしてきました。すべてのアプリは、ある時(shí)點(diǎn)でユーザーと「通信」する必要があります。ユーザーと話をするには、アプリケーションには複數(shù)のサポート、性別の変動(dòng)、日付の書式設(shè)定、デジタルフォーマット、通貨のフォーマットが必要になる場合があります。英語であっても、仕事を正しく行うのは難しい場合があります。

グローバル化とは何ですか？

グローバライズは、公式のUnicode CLDR JSONデータを利用する國際化とローカリゼーションのためのJavaScriptライブラリです。

このライブラリはオープンソースで、Rafael Xavier de SouzaとJQueryチームの一部のメンバーによって開発されています。

Globalize Unicode ConsortiumベースのUnicode Consortium Data Repository（CLDR）は、利用可能なロケールデータの最大かつ最も包括的な標(biāo)準(zhǔn)リポジトリです。したがって、ロケールデータを埋め込むライブラリとは異なり、Globalizeを使用する場合、最新のCLDRデータを常に簡単に使用できます。

このライブラリは、ブラウザとnode.jsモジュールに適しています。 Globalize 1.0は、IE9、Chrome、Firefox、Safari 5.1、Opera 12.1など、すべての主要なブラウザーをサポートしています。

このライブラリの主な関數(shù)には、

：

が含まれます

デジタルフォーマットと解析

日付と時(shí)刻のフォーマットと解析
相対時(shí)間のフォーマット
通貨形式
メッセージフォーマット
複數(shù)のサポート
ユニットサポート
• 私がGlobalizeで一番気に入っているのは、それぞれの機(jī)能にモジュールを提供することです。開発者はライブラリ全體を必要としない場合があるため、必要なモジュールを選択できます。もう1つの興味深い機(jī)能は、他のライブラリとは異なり、ライブラリにロケールデータをホストまたは埋め込まないことにより、コンテンツとは別にコードを保持することです。

しかし、グローバル化が唯一の選択肢ではありません。他の代替品に興味がある場合、Rafaelには専用のページがあります。最も注目すべき代替品はI18Nextです。

Globalize and JavaScript Internationalization API

これは皆さんにとって驚くかもしれませんが、JavaScriptは國際化API（ECMA-402とも呼ばれる）を通じて國際化に対するネイティブサポートを提供します。 INTLオブジェクトは、國際化されたAPIの名前空間として機(jī)能するウィンドウオブジェクトで利用可能なオブジェクトです。このAPIは現(xiàn)在、特定の言語の文字列を比較するだけでなく、數(shù)字と日付をフォーマットする方法を提供します。

國際的なAPIの存在を知っているので、Globalizeが舞臺(tái)裏でそれを使用していると思うかもしれません。このアプローチは、日付と數(shù)のフォーマットのパフォーマンスを確実に改善します。ただし、ブラウザ間では低くて一貫性のないサポートのため、ライブラリはそれを使用していません。

グローバル化について議論し続ける前に、國際的なAPIを體験してほしい。

フォーマット日

私が示す最初の例は、國際APIを使用して、複數(shù)のロケールで日付をフォーマットすることです：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));

この例では、指定されたロケール（ "it-it"、 "en-us"、 "en-gb"）を使用して、dateTimeFormatコンストラクターを使用して新しい日付フォーマッタを作成します。次に、フォーマットメソッドを呼び出して、日付オブジェクトをフォーマットします。

上記のコードはJSBINとしても使用できます。

フォーマット番號

前述のように、

APIでは、數(shù)値をフォーマットすることもできます。 NumberFormatコンストラクターを使用した例を以下に示します

この2番目のコードスニペット（JSBINとして使用することもできます）の出力を見ると、イタリアでは、米國と英國よりも數(shù)字の異なる形式があることに気付くことができます。

前述のように、この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));

今度は、國際化とローカリゼーションがどのように機(jī)能するかをよりよく理解したので、グローバル化について議論しましょう。

インストールしてグローバル化

を使用します

Globalizeは、NPM：

を通じて簡単にインストールできます

このコマンドもCLDRデータをインストールします。これは、Globalizeが使用するロケールデータをロードするために必要です（たとえば、數(shù)字や日付の言語形式で）。これら2つのパッケージをインストールした後、ライブラリを使用できます。

注：次の例では、ノードが使用されていることを前提としています。ブラウザでグローバル化を使用することに興味がある場合は、プロジェクトのホームページの例から始めることをお?jiǎng)幛幛筏蓼埂?Webpackの例により、すぐに起きて実行が簡単になります。

npm install globalize cldr-data --save

次に、Globalizeを使用して、前のセクションにリストされている2つのコードスニペットを書き換えます。

フォーマット日

最初の例は、次のように実裝できます

// 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標(biāo)準(zhǔn)（「IT-IT」および「EN-US」など）の完全なバージョンを必要とします。イタリア人がイタリア語であると仮定するのは合理的であるように思われますが（結(jié)局イタリア語はイタリアで生まれた）、これは英語を混亂させています。 「en」とは、英國の英語ではなく、アメリカの英語を意味します。あなたが私と同じ間違いを犯さないようにしたい場合は、このテーブルをチェックすることをお?jiǎng)幛幛筏蓼埂?

概要を示す価値のある別の概念は、補(bǔ)足法全體（コードの3番目のステートメント）です。これにより、國またはロケールデータの補(bǔ)足情報(bào)を含むすべてのファイルがロードされます。たとえば、電話國コード（イタリアの39）、人口、いくつかのよく知られている略語、他の國の通貨の綴り方など

私が紹介したい最後のポイントは、4番目のステートメントであり、ここではAvereMainforメソッドを呼び出します。これにより、必要な國（イタリア、米國、および英國の例の例）にロケールデータを読み込むことができます。

フォーマット番號

數(shù)字をフォーマットするために、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));

値がフォーマットされる番號である場合、オプションはカスタムメソッドの返品値のオブジェクトです。指定できるオプションのいくつかの例は次のとおりです

ラウンド：數(shù)字を丸める方法を定義します。その価値は次のいずれかになります：天井、床、丸い、または切り捨て
USEGROUPING：グループ化區(qū)切り文字を使用するかどうかを示すブール値
MinimutIntegerDigits：使用する整數(shù)數(shù)字の最小數(shù)を示す非陰性整數(shù)。

利用可能なオプションの完全なリストは、ドキュメントに記載されています。

フォーマットナンバーメソッドについて詳しく學(xué)んだので、実際にどのように適用されるかを見てみましょう。

npm install globalize cldr-data --save

通貨値をフォーマット

ライブラリは、通貨値をフォーマットするのに役立つ通貨ファッターメソッドを提供します。このメソッドは多くのオプションをサポートし、通貨のシンボル（「$」など）またはそのコード（「USD」など）などを使用するかなど、番號を丸めたいかどうかを定義できます。

數(shù)字を分析します

// 包含 Globalize 庫
var Globalize = require('globalize');

// 包含 CLDR 數(shù)據(jù)
var cldrData = require('cldr-data');

// 加載補(bǔ)充數(shù)據(jù)
Globalize.load(cldrData.entireSupplemental());

// 加載指定語言環(huán)境的數(shù)據(jù)
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));

數(shù)字の解決は、ユーザー入力を処理するときなど、実行する必要があるタスクでもあります。次の例は、これを行う方法を示しています

相対日付

のフォーマット

最新のWebアプリケーションのもう1つの非常に一般的な機(jī)能は、相対的な用語で日時(shí)を表示することです。たとえば、1日の完全な日付を表示する代わりに、「昨日」や「先週」などのラベルを見つけることがよくあります。 Globalizeを使用すると、このタスクは、relativeTimeFormatterメソッドで簡単に実現(xiàn)できます。使用の例は次のとおりです

// 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は、この記事で説明していない他の多くの方法を提供します。ただし、ここに示されているトピックは、始めるのに役立つ十分な情報(bào)を提供する必要があります。さらに、このライブラリのドキュメントは非常に詳細(xì)です。

結(jié)論

この記事では、國際化とローカリゼーションが何であるか、そして製品の市場を拡大するために非常に重要である理由について説明します。いくつかのサポートされた機(jī)能に言及して、國際化されたAPIを簡単に紹介しました。その後、それらの使用例をいくつか示しました。

この記事の第2部では、jQueryチームが國際化とローカリゼーションのために開発したJavaScriptライブラリであるGlobalizeを紹介します。ライブラリは非常に強(qiáng)力であり、プロジェクトを國際化するために必要なすべての方法が付屬しています。たとえば、數(shù)字、フォーマット日、フォーマット通貨値などです。図書館が時(shí)間を節(jié)約していると思う場合は、プロジェクトに貢獻(xiàn)することで、お?dú)葺Xにお返事をしてください。

この記事で示されているすべてのコードスニペットがGitHubリポジトリにあることを繰り返して思い出させてください。

JavaScript（i18n）

での國際化に関する

FAQ（FAQ）

JavaScriptの國際化（I18N）の重要性は何ですか？

多くの場合、I18Nと略される國際化は、特にグローバルな視聴者向けのアプリケーションを作成する場合、Web開発の重要な側(cè)面です。複數(shù)の言語と地域の違いをサポートするために、ウェブサイトまたはアプリケーションを準(zhǔn)備することが含まれます。これは、Web開発で広く使用されている言語であるJavaScriptで特に重要です。 JavaScriptにI18Nを?qū)g裝することにより、開発者はさまざまなユーザーグループを満たすアプリケーションを作成し、ユーザーエクスペリエンスとアクセシビリティを向上させることができます。また、アプリケーションのローカライズにも役立ち、アプリケーションのカバレッジと使いやすさを大幅に改善できます。

JavaScriptではI18Nはどのように機(jī)能しますか？

JavaScriptの

i18nは、開発者がアプリケーションのコードからロケール固有の文字列またはメッセージを外部化できるようにすることで機(jī)能します。これらの文字列は、多くの場合、リソースパッケージと呼ばれる別のファイルに保存されます。各リソースパッケージは、特定のロケールに対応しています。アプリケーションが実行されると、ユーザーのロケールを認(rèn)識し、対応するリソースパッケージをロードします。これにより、アプリケーションはユーザーの優(yōu)先言語でメッセージとコンテンツを表示できます。

JavaScriptにi18nを?qū)g裝するための人気のあるライブラリは何ですか？

JavaScriptにi18nを?qū)g裝するために利用できるライブラリがいくつかあります。最も人気のあるライブラリには、I18Next、I18N-JS、Globalizeが含まれます。これらのライブラリは、言語検出、複數(shù)形、數(shù)値形式などの國際化を促進(jìn)するためのさまざまな機(jī)能を提供します。また、React、Angular、Vue.jsなどのさまざまなフレームワークをサポートしているため、Web開発のための汎用性の高いツールになります。

JavaScriptプロジェクトでi18n-jsライブラリを使用する方法は？

JavaScriptプロジェクトでI18N-JSライブラリを使用するには、最初にNPMまたはYARNを使用してインストールする必要があります。インストールしたら、プロジェクトにインポートして、その機(jī)能の使用を開始できます。このライブラリは、文字列を翻訳し、數(shù)値と日付をフォーマットする機(jī)能を提供します。また、翻訳を別のJSONファイルに定義することもできます。これは、ライブラリがユーザーのロケールに従ってこれらのファイルをロードできます。

ライブラリを使用せずにJavaScriptにi18nを?qū)g裝できますか？

はい、i18nはライブラリを使用せずにJavaScriptに実裝できます。これは、コードからロケール固有の文字列を手動(dòng)で外部化し、個(gè)別のファイルに保存することで実行できます。ただし、より大きなアプリケーションの場合、このアプローチは時(shí)間がかかり、複雑になる場合があります。ライブラリを使用してプロセスを簡素化し、アプリケーションの國際化を強(qiáng)化する追加機(jī)能を提供します。

i18nの複數(shù)形に対処する方法は？

I18Nでの複數(shù)形成の処分は、異なる言語で異なる複數(shù)ルールのために難しい場合があります。ただし、多くのI18Nライブラリは、多元化を処理する能力を提供します。たとえば、I18N-JSライブラリは、ユーザーのロケールに従って複數(shù)形を処理できる複數(shù)形関數(shù)を提供します。

私のアプリケーションの國際化をテストする方法は？

アプリケーションの國際化をテストするには、アプリケーションがユーザーのロケールに基づいて異なる言語のコンテンツとフォーマットを正しく表示するかどうかを確認(rèn)することが含まれます。これは、ブラウザ內(nèi)のロケール設(shè)定を手動(dòng)で変更するか、自動(dòng)テストツールを使用することで実行できます。また、翻訳の不足や誤った複數(shù)形式など、エッジケースを確認(rèn)することも重要です。

i18nで日付と數(shù)字の形式を処理する方法は？

日付と數(shù)の形式は、ロケール間でかなり異なる場合があります。多くのI18Nライブラリは、ユーザーのロケールに従って日付と數(shù)値をフォーマットする機(jī)能を提供します。たとえば、I18N-JSライブラリは、これらのタスクを処理できるフォーマットデートおよびフォーマンバル機(jī)能を提供します。

i18nで右から左（RTL）言語を処理する方法は？

i18nの右から左（RTL）言語の処理には、ユーザーのロケールに基づいてアプリケーションのレイアウトとテキストの方向を調(diào)整することが含まれます。これは、CSSおよびHTMLプロパティを使用して実行できます。一部のI18Nライブラリは、RTL言語を処理する機(jī)能も提供します。

I18Nを使用したローカリゼーション（L10N）を処理する方法は？

通常、L10Nと略される

ローカリゼーションには、翻訳コンテンツ、日付や數(shù)字のフォーマットなど、特定のロケールにアプリケーションを適応させることが含まれます。 I18Nは複數(shù)のロケールをサポートするためにアプリケーションを準(zhǔn)備しますが、L10Nは特定のロケールごとにこれらの調(diào)整を?qū)g裝することを伴います。多くのI18Nライブラリも、ローカリゼーションを処理する機(jī)能を提供します。

以上がJavaScriptに國際化（I18N）を?qū)g裝する方法の詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國語 Web サイトの他の関連記事を參照してください。