亚洲精品久久久中文字幕-亚洲精品久久片久久-亚洲精品久久青草-亚洲精品久久婷婷爱久久婷婷-亚洲精品久久午夜香蕉

您的位置:首頁技術文章
文章詳情頁

javascript - 如何優雅的在一個js文件里配置多語言(i18n),求探討思路

瀏覽:76日期:2023-03-21 15:00:26

問題描述

我搜了搜資料,發現大多數是不同語言的js文件分開做,然后根據用戶語言環境去加載對應的js文件。

但是我現在因為使用場景限制,最好是在一個js文件里完成。我現在打算支持3種語言(中文、日文、英文),而且輸出文字的地方也比較多,可能有上百條,中間也經常要拼接變量。

使用場景示例:

var result=10;document.body.innerHTML='一共有'+result+'個結果';

現在我的思路有兩種,一種是把語言文字保存到一個變量里;一種是把文字寫在原地,形式為數組,然后使用下標調用。

思路1:

// 方式1:判斷語言后確定唯一的結果。有點割裂,而且在使用時只能看到屬性名,影響思路// {w1}是占位符,每個配置寫了多遍是為了模擬數量多的時候的情景var lang={};if () { // 判斷為中文 lang.tip1='一共有{w1}個結果'; // lang.tip2='一共有{w1}個結果'; // lang.tip3='一共有{w1}個結果'; // lang.tip4='一共有{w1}個結果'; // lang.tip5='一共有{w1}個結果';}else if(){ // 判斷為日文 lang.tip1='{w1}の結果の合計'; // lang.tip2='{w1}の結果の合計'; // lang.tip3='{w1}の結果の合計'; // lang.tip4='{w1}の結果の合計'; // lang.tip5='{w1}の結果の合計';}else if(){ // 判斷為英文 lang.tip1='There is a total of {w1} result'; // lang.tip2='There is a total of {w1} result'; // lang.tip3='There is a total of {w1} result'; // lang.tip4='There is a total of {w1} result'; // lang.tip5='There is a total of {w1} result';}var result=10;document.body.innerHTML=lang.tip1.replace('{w1}',result);思路2:

// 方式2:判斷語言后只做個下標,文字寫在原地方。這樣使用時可以知道這里寫的是什么,但似乎比較亂var lang;if () { // 判斷為中文 lang=0;}else if(){ // 判斷為日文 lang=1;}else if(){ // 判斷為英文 lang=2;}var result=10;document.body.innerHTML=['一共有{w1}個結果','{w1}の結果の合計','There is a total of {w1} result'][lang].replace('{w1}',result);

其實第一種方法形式上較為優雅,不過我個人傾向于第二種,主要是我看代碼的時候知道這里寫的是什么。如果通過變量名判斷內容的話則比較麻煩(主要是條數太多,雖然我實際使用的話要把變量名做語義化處理,但能簡短、準確描述出內容的情況也不多)。

請問大家有其他思路或解決辦法嗎?

問題解答

回答1:

你的意思大概是想把所有文字都翻譯,但由于語法結構問題變量的位置是未知的不知道怎么解決是吧?思路的話其實你可以參考模板渲染的思路.我打個比方

var language = { ’hello’: [’hello,{val}!’,’{val},コン!’ ]};var lang = 0; // 當前英文function translate (msgVariable, data, msg) { if (msg !== undefined) language[msgVariable].push(msg); return language[msgVariable][lang].replace(’{val}’, data);}var data = ’張三’;var msg = translate(’hello’, data, ’你好,{val}!’);回答2:

比如這樣?

var hello = { 'cn' : '哈嘍', 'jp' : 'こんにちは', 'en' : 'f**k you'};//在頁面初始化的時候判斷當前的環境,然后直接設定key值就可以,比如說我現在是日語var lang = 'jp';console.log(hello[lang]);//拓展的話往對象里面加值就行了,比如說加韓文var hello = { 'cn' : '哈嘍', 'jp' : 'こんにちは', 'en' : 'f**k you', 'kr' : '為何不洗澡思密達'};lang = 'kr';console.log(hello[lang]);回答3:

您的問題算是i18n/L10n的範圍,或許可以找到像

jQuery.i18n

JavaScript I18n And L10n等等的國際化和本地化的javascript 庫。第一個庫還是維基媒體搞出來的,很有參考價值。

其他基本的i18n/L10n內容及庫,別錯過

Unicode CLDR如簡中語言表

ICU library

本人對i18n/L10n的在中國的發展很感興趣,一起切磋成長。

標簽: JavaScript
主站蜘蛛池模板: 高清国产精品久久 | 一级做a爰片久久毛片看看 一级做a爰片久久毛片美女 | 欧美福利片在线观看 | 99精品国产成人一区二区在线 | 免费播放国产一级 | 女人毛片在线 | 国产72av国片精品jk制服 | 毛片黄| tom成人影院新入口在线 | 国内精品一区二区三区 | 欧美一级免费观看 | 中文字幕h | 欧美在线网 | 婷婷成人基地 | 欧美午夜激情影院 | 伊人中文字幕在线观看 | pans国产大尺度私密拍摄视频 | 欧美一区二区三区gg高清影视 | 日操夜操天天操 | 久草热视频 | 日韩版码免费福利视频 | 91日本在线视频 | 亚洲综合性| 欧美成人高清免费大片观看 | 国产精品第三页 | 国产福利在线视频尤物tv | 国产成人免费高清激情视频 | 国产亚洲视频在线观看 | 日韩亚洲欧美性感视频影片免费看 | 一级片www | 欧美综合图区亚欧综合图区 | 黄色网页在线免费观看 | 日本久久久久中文字幕 | 国产1区二区 | 国产福利不卡 | 亚欧成人毛片一区二区三区四区 | 伊人久久久久久久久久 | 国产亚洲亚洲精品777 | 免费观看一级成人毛片软件 | 国产亚洲欧美视频 | 亚洲精品综合一区二区 |