Javascript应用程序中的本地化

Today I would like to talk about localizing (Internationalization) JavaScript applications.

今天，我想谈谈本地化（国际化）JavaScript应用程序。

Introduction

介绍

When creating an application that is going to be used by many people around the globe, it is important to remember that not everyone speaks English (specially in Mexico, where I am from), so we have to code our app to support at least two languages and be prepared to include more when needed.

在创建将要被全球许多人使用的应用程序时，重要的是要记住，并不是每个人都说英语（特别是在我来自墨西哥的墨西哥），因此我们必须对应用程序进行编码以支持至少两个语言，并在需要时准备包括更多语言。

We have two worlds, Server and Client side and both of them need to know how to name for example, a title: EN Title ES Titulo, and so on. This is quite simple if we have static forms that are loaded from the server, because most of the server-side frameworks out there are already prepared for localization (CodeIgniter, Cake PHP).

我们有两个世界，服务器端和客户端，它们两个都需要知道如何命名，例如标题：EN Title ES Titulo，依此类推。 如果我们有从服务器加载的静态表单，这非常简单，因为那里的大多数服务器端框架都已经准备好进行本地化（CodeIgniter，Cake PHP）。

In these frameworks we can define all of the expressions used in our application and their template engines do the rest. But, that's on the server side.  How can we pass that information to the client? Very simple.

在这些框架中，我们可以定义应用程序中使用的所有表达式，其余的由模板引擎完成。 但是，那是在服务器端。 我们如何将这些信息传递给客户？ 很简单。

Let's Get started

让我们开始吧

In CodeIgniter for example, we can retrieve the files at runtime. Each of the localized entries are in a hashed array like this:

例如，在CodeIgniter中，我们可以在运行时检索文件。 每个本地化条目都位于哈希数组中，如下所示：

//file EN.php
$locale['welcome'] = 'Welcome to our site';
$locale['alert'] = 'Why you do this?';

//file ES.php
$locale['welcome'] = 'Bienvenido al Sitio';
$locale['alert'] = '¿Porque Haces esto?';

{welcome : 'Welcome to our site', alert: 'Why you do this?'}

When recieving the string, we can pick it up with JavaScript, encode it to JSON and save it to a variable. (We have to encode it to JSON if we used an AJAX call, we can use the EVAL (Not recommended) or any encode-decode JSON library of your choice).

接收字符串时，我们可以使用JavaScript对其进行提取，将其编码为JSON并将其保存到变量中。 （如果使用AJAX调用，则必须将其编码为JSON，我们可以使用EVAL（不推荐）或您选择的任何编码解码JSON库）。

We're almost done, now we have a JavaScript object we can use in our client side, which contains all of the locals we need on our app.

我们差不多完成了，现在我们有了一个可以在客户端使用JavaScript对象，其中包含我们在应用程序上需要的所有本地语言。

Javascript structure:

JavaScript结构：

var lang = {
      welcome : 'Welcome to our site', 
      alert : 'Why you do this?'
}

Finally, we can use our locales like this:

最后，我们可以像这样使用语言环境：

alert(lang.welcome);

Depending on the array we load at the server, the result will be:

根据我们在服务器上加载的阵列，结果将是：

   Welcome to our site (English file loaded)

欢迎来到我们的网站 （已加载英文文件）

or

要么

   Bienvenido al Sitio (Spanish file loaded)

Bienvenido al Sitio （已加载西班牙文件）

This information is very basic, but I've found out that no many people knows about it.

这些信息非常基础，但是我发现没有多少人知道。

This is my first article, feel free to send me feedback, questions or complains =P

这是我的第一篇文章，请随时向我发送反馈，问题或投诉= P

Thanx!

谢谢！

Jerry

杰瑞

翻译自: https://www.experts-exchange.com/articles/3500/Localization-in-Javascript-Applications.html