前言
第一次了解到这个概念,之前在QQ群也有人聊前端国际化如何做的问题,不知道这篇对他有帮到吗?今日早读文章来自阿里@sundway分享。
正文从这开始~
何为国际化
国际化(Internationalization)通常在很多地方会用 i18n 代替,意思就是 I 加18个字母加 n。跟国际化还有一个类似的概念叫做本地化(Localization)通常用 L10n 表示。这是两个比较接近的概念,它之间有什么区别呢?W3C 的 Localization vs. Internationalization 这篇文档详细了介绍了这一点,对国际化理解还不是特别清晰的强烈建议读一下这篇文章。简单的理解就是,国际化就是为本地化做很多的前期工作,可以根据所做的事情是否属于只是为某一地区来区分国际化和本地化。国际化包含的东西很多,对于前端,最常接触到的就是将可本地化的元素与源代码或内容分开,以便可以根据需要根据用户的国际偏好来加载或选择本地化的替代。但国际化的工作远不止这些,例如国际化CDN 部署,Unicode 编码都可以算作国际化的范畴。
国际化 API
其实在 2012 年就已经拟定了国际化 API,详尽的内容可以参考 《ECMAScript Internationalization API Specification》。下面重点介绍几个 API 的使用:
Intl.Collator
Intl.Collator 是用于语言敏感字符串比较的 collators构造函数。语法:
new Intl.Collator([locales[, options]])
Intl.Collator.call(this[, locales[, options]])
上述语法中,locales 是可选参数,locales 的参数必须遵从 BCP 47 规范,locales 标记必须是 "en-US" 和 "zh-Hans-CN 等,这个标记包含了语言、地区和国家。完整的列表可以查看 IANA language subtag registry。options 也是可选参数,它包含了特定比较选项的对象。
示例:
var co1 = new Intl.Collator(["de-DE-u-co-phonebk"]);
var co2 = new Intl.Collator(["de-DE"]);
var co3 = new Intl.Collator(["en-US"]);
var arr = ["ä", "ad", "af", "a"];
if (console && console.log) {
console.log(arr.sort(co1.compare));
console.log(arr.sort(co2.compare));
console.log(arr.sort(co3.compare));
}
Intl.DateTimeFormat
Intl.DateTimeFormat是根据语言来格式化日期和时间的类的构造器类。
new Intl.DateTimeFormat([locales[, options]])
Intl.DateTimeFormat.call(this[, locales[, options]])
Intl.DateTimeFormat是根据语言来格式化日期和时间的类的构造器类。可以使用 options 参数来自定义 日期时间格式化方法返回的字符串。
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
console.log(new Intl.DateTimeFormat('en-US').format(date));
console.log(new Intl.DateTimeFormat('en-GB').format(date));
console.log(new Intl.DateTimeFormat('ko-KR').format(date));
console.log(new Intl.DateTimeFormat('ar-EG').format(date));
console.log(new Intl.DateTimeFormat('ja-JP-u-ca-japanese').format(date));
console.log(new Intl.DateTimeFormat(['ban', 'id']).format(