Web 前端本地化（三）

时间：2023-01-24 03:17:48

前面两篇文章介绍了语言的设置和获取，以及语言包的加载与扩展。接下来，也是一个比较核心的东西，那就是如何去读取和设置某一具体的文本。

获取本地的某一文本，首先当然是要获取该语言包。因此，我们需要一些辅助方法，来先行做到这一点。（如果需要隐藏这些私有方法，大家可以自行解决，因为这不是本文的重点，故在此不再描述，本文主要是介绍其实现原理。）

Local.prototype._getStrings = function (lang) {
    if (lang == null) lang = Local.lang();
    if (!lang) {
        return undefined;
    }
 
    return this._strings[lang.toString().toLowerCase()];
}

为了防止意外，在这个方法里，我们还需要提供一项功能，即，如果该语言包并不存在，我们需要返回一个空的 JSON 对象，而不是空或未定义。因此我们又将该方法修改成了如下所示。

Local.prototype._getStrings = function (lang, init) {
    if (lang == null) lang = Local.lang();
    if (!lang) return {};
 
    lang = lang.toString().toLowerCase();
    if (!this._strings[lang]) {
        if (init == true) {
            this._strings[lang] = {};
            return this._strings[lang];
        }
 
        return {};
    }
 
    return this._strings[lang];
}

然后，我们可以实现 Local.specificString 成员方法，以来支持获取或设置某一特定语言的文本了。

/**
  * 获取或设置某一特定语言的某一文本。
  * @param lang  语言编号。
  * @param key  文本对应的 Key。
  * @param value  可选。设置文本值。
  */
Local.prototype.specificString = function (lang, key, value) {
    if (arguments.length > 2) {
        var strings = this._getStrings(lang, true);
        strings[key] = value;
    }
 
    return this._getStrings(lang)[key];
}

另外，也可以提供一个直接获取本地语言的某一文本的方法。

/**
  * 获取或设置某一本地文本。
  * @param key  文本对应的 Key。
  * @param value  可选。设置文本值。
  */
Local.prototype.localString = function (key, value) {
    return arguments.length > 1 ? this.specificString(Local.lang(), key, value) : this.specificString(Local.lang(), key);
}

我们接着上一篇文章的测试示例，继续来看看现在的实现。

// Append to the previous test code.
// var local = new Local();
// ...
// Suppose current environment is in "en".
 
// "你好"
console.debug(local.localString("greetings"));
 
// "好不好呀？"
console.debug(local.localString("greetings", "好不好呀？"));
 
// "好不好呀？"
console.debug(local.localString("greetings"));
 
// undefined
console.debug(local.localString("what"));
 
// "什么？"
console.debug(local.localString("what", "什么？"));
 
// "什么？"
console.debug(local.localString("what"));
 
// "Hello!"
console.debug(local.specificString("greetings", "en"));
 
// "Hi!"
console.debug(local.specificString("greetings", "zh-Hans", "Hi!"));

不过，考虑到你当前的浏览器语言是 zh-Hans-cn 而不是 zh-Hans 或 zh-cn，那么，你或许会发现这并不能获得到你想要的文本，因为并没有类似于继承的功能在这其中实现。这可怎么办？敬请期待下一篇文章。

【未完待续】

文章类型及复杂度：Web 前端开发进阶。

节选翻译自 MSDN 博文 Localization in web page，内容有所调整。

http://blogs.msdn.com/b/kingcean/archive/2016/03/30/web-localization.aspx

标签：

相关文章