42th Unicode Conference隨筆（一）
阿新 • • 發佈：2018-12-11
三國曹丕的《典論·論文》中說：“文人相輕，自古而然。”這話其實還有後句的，叫“武人相重”。而我輩應當算作文人？抑或武人呢？竊以為還是偏武多一些，畢竟IT圈兒的主流依然是“夜裡挑燈看劍，夢迴吹角連營”，吟風弄月的懷橘陸郎多半難成氣候。然而面對業內充斥著的各種不厭其煩發明著的輪子，倒也不禁難掩大家平實的外表下文人騷客的風骨。畢竟“文無第一，武無第二”，別人提供的框架、程式碼庫怎麼都覺得差點兒意思，還是得老夫親自披堅執銳來打造自己眼中的白月光，心頭的硃砂痣。稍加潤色，又一個業內的incredible game changer就這樣的伴著祥瑞轟隆而至。別的不說，一個小小的國際化前端生態圈，就可以如此的山頭林立，以至於城頭變幻大王旗成了家常便飯，同時務必需要注意的是，仍有一大波changer正在趕來的路上。
照片來42th Unicode Conference現場
目光重新回到這小小的國際化前端生態圈兒吧，來自AWS的Alolita Sharma女士在她的slides中詳解了GlobalizeJS的新特性。在筆者參加的幾個有限session中，Alolita帶來的What’s New with GlobalizeJS應該算是穩居三甲了。但作為GlobalizeJS這樣開源前端庫的擁躉，本文並不想大談特談其新特性，反其道而行之，說說What’s Old吧，用一個個的示例來看看他已經為我們帶來了什麼。
npm install globalize npm install cldr-data npm install iana-tz-data
這個過程如遇錯誤，請耐心重試。接下來我會按照四個模組進行效果展示。
時間
var Globalize = require( "globalize" ); Globalize.load( require( "cldr-data" ).entireSupplemental() ); Globalize.load( require( "cldr-data" ).entireMainFor( "fr", "de", "zh", "zh-Hant", "ja", "ko", "pt", "ar", "ru") ); Globalize.loadTimeZone( require( "iana-tz-data" ) ); var d1 = Globalize("fr").dateFormatter({ datetime: "full"})(new Date()); console.log(d1); var d2 = Globalize("de").dateFormatter({ datetime: "full"})(new Date()); console.log(d2); var d3 = Globalize("zh").dateFormatter({ datetime: "full"})(new Date()); console.log(d3); var d4 = Globalize("zh-Hant").dateFormatter({ datetime: "full"})(new Date()); console.log(d4); var d5 = Globalize("ja").dateFormatter({ datetime: "full"})(new Date()); console.log(d5); var d6 = Globalize("ko").dateFormatter({ datetime: "full"})(new Date()); console.log(d6); var d7 = Globalize("pt").dateFormatter({ datetime: "full"})(new Date()); console.log(d7); var d8 = Globalize("ar").dateFormatter({ datetime: "full"})(new Date()); console.log(d8); var d9 = Globalize("ru").dateFormatter({ datetime: "full"})(new Date()); console.log(d9);
列印結果如下。
mardi 25 septembre 2018 à 14:20:00 UTC+08:00
Dienstag, 25. September 2018 um 14:20:00 GMT+08:00
2018年9月25日星期二 GMT+08:00 下午2:20:00
2018年9月25日 星期二 下午2:20:00 [GMT+08:00]
2018年9月25日火曜日 14時20分00秒 GMT+08:00
2018년 9월 25일 화요일 오후 2시 20분 0초 GMT+08:00
terça-feira, 25 de setembro de 2018 14:20:00 GMT+08:00
الثلاثاء، ٢٥ سبتمبر ٢٠١٨ ٢:٢٠:٠٠ م غرينتش+٠٨:٠٠
вторник, 25 сентября 2018 г., 14:20:00 GMT+08:00貨幣
var cash = 999999;
console.log( Globalize("fr").currencyFormatter("EUR")(cash) );
console.log( Globalize("fr").currencyFormatter("EUR", { style: "name" })(cash) );
console.log( Globalize("fr").currencyFormatter("EUR", { style: "code" })(cash) );
console.log( Globalize("ja").currencyFormatter("JPY")(cash) );
console.log( Globalize("ja").currencyFormatter("JPY", { style: "name" })(cash) );
console.log( Globalize("ja").currencyFormatter("JPY", { style: "code" })(cash) );
console.log( Globalize("zh-Hant").currencyFormatter("HKD")(cash) );
console.log( Globalize("zh-Hant").currencyFormatter("HKD", { style: "name" })(cash) );
console.log( Globalize("zh-Hant").currencyFormatter("HKD", { style: "code" })(cash) );結果如下。
999 999,00 €
999 999,00 euros
999 999,00 EUR
￥999,999
999,999円
999,999JPY
HK$999,999.00
999,999.00 港幣
999,999.00 HKD數字
var num = 123456789.123;
console.log( Globalize("fr").numberFormatter()(num) );
console.log( Globalize("de").numberFormatter()(num) );
console.log( Globalize("zh").numberFormatter()(num) );
console.log( Globalize("zh-Hant").numberFormatter()(num) );
console.log( Globalize("ja").numberFormatter()(num) );
console.log( Globalize("ko").numberFormatter()(num) );
console.log( Globalize("pt").numberFormatter()(num) );
console.log( Globalize("ar").numberFormatter()(num) );
console.log( Globalize("ru").numberFormatter()(num) );輸出如下。
123 456 789,123
123.456.789,123
123,456,789.123
123,456,789.123
123,456,789.123
123,456,789.123
123.456.789,123
١٢٣٬٤٥٦٬٧٨٩٫١٢٣
123 456 789,123單位
var count = 9;
console.log( Globalize("fr").unitFormatter("mile-per-hour", { form: "long" })(count) );
console.log( Globalize("de").unitFormatter("mile-per-hour", { form: "long" })(count) );
console.log( Globalize("zh").unitFormatter("mile-per-hour", { form: "long" })(count) );
console.log( Globalize("zh-Hant").unitFormatter("mile-per-hour", { form: "long" })(count) );
console.log( Globalize("ja").unitFormatter("mile-per-hour", { form: "long" })(count) );
console.log( Globalize("ko").unitFormatter("mile-per-hour", { form: "long" })(count) );
console.log( Globalize("pt").unitFormatter("mile-per-hour", { form: "long" })(count) );
console.log( Globalize("ar").unitFormatter("mile-per-hour", { form: "long" })(count) );
console.log( Globalize("ru").unitFormatter("mile-per-hour", { form: "long" })(count) );顯示如下。
9 miles par heure
9 Meilen pro Stunde
每小時9英里
每小時 9 英里
時速 9 マイル
시속 9마일
9 milhas por hora
٩ ميل في الساعة
9 миль в час複數
Globalize.loadMessages({
en: {
task: [
"You have {count, plural,",
" =0 {no task}",
" one {one task}",
" other {{formattedCount} tasks}",
"} remaining"
]
}
});
numberFormatter = Globalize("en").numberFormatter();
taskFormatter = Globalize("en").messageFormatter( "task" );
console.log(taskFormatter({
count: 1000,
formattedCount: numberFormatter(1000)
}));
console.log(taskFormatter({
count: 1,
formattedCount: numberFormatter(1)
}));
console.log(taskFormatter({
count: 0,
formattedCount: numberFormatter(0)
}));映入眼簾的文字如下。
You have 1,000 tasks to do!
You have one task to do!
You have no task to do!不難發現GlobalizeJS作為一個前端i18n庫已經足夠細節和優秀了，思之再三仍無法給自己一個另起爐灶，再做輪子的動機和理由。即便面對某些場景不那麼完美時，我們為何不擁抱她，加入她呢？古人云：“獨樂樂，與人樂樂，孰樂乎？不若與人”誠哉斯言！