使用 .toLocaleString() 轻松实现多国语言价格数字格式化
用代碼對數(shù)字進(jìn)行格式化，顯然不是逢三位加逗號這么簡單。比如印度在數(shù)字分位符號上的處理，就堪稱業(yè)界奇葩：
印度的數(shù)字讀法用“拉克”（十萬）和“克若爾”（千萬），數(shù)字標(biāo)法用不對稱的數(shù)位分離，即小數(shù)點左側(cè)首先是三位分隔，然后繼續(xù)向左都是兩位分隔。如：三千萬（3 克若爾）會寫成 3,00,00,000。 —— 維基百科
簡單的暴利處理無法滿足多語言支持，此時使用 Number.prototype.toLocaleString() 進(jìn)行數(shù)字格式化處理再好不過。
使用 .toLocaleString()
在 JavaScript 中，數(shù)字對象的 .toLocaleString() 方法如果不傳參數(shù)，則采用宿主環(huán)境的系統(tǒng)語言進(jìn)行分位處理。
var price = 1024; price.toLocaleString(); // => "1,024"使用 locales 參數(shù)
在 ECMA-402 標(biāo)準(zhǔn)的實現(xiàn)中，增加了.toLocaleString() 方法對 locales 的支持，語法為 numObj.toLocaleString([locales [, options]])，locales 參數(shù)接收 BCP 47 語言標(biāo)簽格式的字符串或數(shù)組
那么將數(shù)字強制轉(zhuǎn)化為印度格式就變的簡單：
var price = 1669999; price.toLocaleString('en-IN'); // => "16,69,999"這樣就可以輕松處理多語言的自動格式化了，只要根據(jù) <html lang="en-IN"> 中的 lang屬性動態(tài)讀取就可以了。
var price = 1669999; var lang = document.querySelector('html').getAttribute('lang'); price.toLocaleString(lang); // 中文頁面下 => "1,669,999"使用 options 參數(shù)
如果僅僅是做到多語言自動格式化數(shù)字，顯然還不夠細(xì)膩。通過 .toLocaleString() 方法的 options 參數(shù)，可以做到轉(zhuǎn)化至相應(yīng)語言的貨幣格式。
在我的項目之前的實現(xiàn)中，多國語言的貨幣符號是通過模板渲染時讀取配置文件完成轉(zhuǎn)換的。如果使用 .toLocaleString() 展示或加工展示所有貨幣數(shù)字，則無需這一步驟：
var price = 2499; price.toLocaleString('en-IN', {style: 'currency',currency: 'INR' }); // => "? 2,499.00"如果不想要顯示末尾的小數(shù)「.00」，只要設(shè)置一下最小分位 minimumFractionDigits 即可（默認(rèn)是 2）
var price = 2499; price.toLocaleString('en-IN', {style: 'currency',currency: 'INR',minimumFractionDigits: 0 }); // => "? 2,499"這樣一個完美的價格格式化功能就完成了。options 對象參數(shù)接收一系列樣式屬性，常用的有：
1.style：可選值為 decimal（小數(shù)）、currency（貨幣）或 percent（百分比）；
2.currency：設(shè)置為貨幣樣式時使用的符號，支持列表在這里；
3.useGrouping：布爾值，是否顯示數(shù)字分位。
關(guān)于 locales 參數(shù)和 options 參數(shù)支持的其它屬性，例如上面使用的 minimumFractionDigits，可以查閱 MDN
兼容性
所有現(xiàn)代瀏覽器都支持 locales 參數(shù)，因此在移動端使用是安全無痛的。桌面端的支持則是 IE11 及以上。
另外，如果想在后端直接對不同頁面直接輸出對應(yīng)的貨幣符或者做分位轉(zhuǎn)換等操作，只要用 node.js 做一個轉(zhuǎn)換就行了。
參考： https://www.cnblogs.com/276815076/p/10028391.html
總結(jié)
以上是生活随笔為你收集整理的使用 .toLocaleString() 轻松实现多国语言价格数字格式化的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： remote: GitLab: Auth
- 下一篇： 信通院公布第三批《软件产品开源代码安全评