Amazon Ads

2014年4月18日 星期五

【JS筆記】JavaScript格式化數字加上千分數逗點

在網頁呈現數字資料時,常會使用千分位符號來標示數字,幫助閱讀,在JavaScript,可以使用正規表示式來達成這樣的標示:
var thousandComma = function(number)
{
 var num = number.toString();
 var pattern = /(-?\d+)(\d{3})/;
 
 while(pattern.test(num))
 {
  num = num.replace(pattern, "$1,$2");
 
 }
 return num;

}
console.log(thousandComma(1234567.89));
在上例中,先定義一個正規表示式,如第4行,這個模式表示「一個字串中,如果未3碼為數字,且前面有一個或多個數字,就會和此模式匹配」。

在第6行中,第一次的while迴圈測試1234567.89這個字串是否與pattern匹配時,因為1234567這一片段符合,所以結果是true,跑到第8行時,對1234567.89這個字串使用replace函式時,會回傳1234,567.89,其中$1代表符合第一個(-?\d+)的部份,也是就1234$2代表符合第二個(\d{3})的部份,就567

在第二次的while迴圈測試時,1234這一片段仍然符合,會跑到第8行時,對1234567.89這個字串,使用replace函式時,1234,567.89中的1234會被替換成1,234,整個字串變成1,234,567.89

在第三次的while迴圈測試時,因為已經沒有「未3碼為數字,且前面有一個或多個數字」的片段,此時就會回傳false離開while迴圈,上列的thousandComma(1234567.89)就會回傳1,234,567.89

最後,要注意的是,上列第4行的第一個小括號中的+不能寫成*,不然會造成無窮迴圈喔!