JS 實現千位分隔符

將普通的數字轉換爲帶千位分隔符格式的數字字符串是一個很是常見的問題，千位分隔符格式的規則是數字的整數部分每三位一組，以「，」分節。小數部分不分節 。
示例：19,351,235.235767
這裏有幾個常見的實現方法。

1.方法一

實現思路是將數字轉換爲字符數組，再循環整個數組， 每三位添加一個分隔逗號，最後再合併成字符串。由於分隔符在順序上是從後往前添加的：好比 1234567添加後是1,234,567 而不是 123,456,7 ，因此方便起見能夠先把數組倒序，添加完以後再倒序回來，就是正常的順序了。要注意的是若是數字帶小數的話，要把小數部分分開處理。

function numFormat(num){
    num=num.toString().split(".");  // 分隔小數點
    var arr=num[0].split("").reverse();  // 轉換成字符數組而且倒序排列
    var res=[];
    for(var i=0,len=arr.length;i<len;i++){
      if(i%3===0&&i!==0){
         res.push(",");   // 添加分隔符
      }
      res.push(arr[i]);
    }
    res.reverse(); // 再次倒序成爲正確的順序
    if(num[1]){  // 若是有小數的話添加小數部分
      res=res.join("").concat("."+num[1]);
    }else{
      res=res.join("");
    }
    return res;
}

var a=1234567894532;
var b=673439.4542;
console.log(numFormat(a)); // "1,234,567,894,532"
console.log(numFormat(b)); // "673,439.4542"

　　

2.方法二

使用JS自帶的函數 toLocaleString

語法： numObj.toLocaleString([locales [, options]])

toLocaleString() 方法返回這個數字在特定語言環境下的表示字符串。

var a=1234567894532;
var b=673439.4542;

console.log(a.toLocaleString());  // "1,234,567,894,532"
console.log(b.toLocaleString());  // "673,439.454"  （小數部分四捨五入了）

　　

要注意的是這個函數在沒有指定區域的基本使用時，返回使用默認的語言環境和默認選項格式化的字符串，因此不一樣地區數字格式可能會有必定的差別。最好確保使用 locales 參數指定了使用的語言。
注：我測試的環境下小數部分會根據四捨五入只留下三位。

 

3. 方法三

使用正則表達式和replace函數，相對前兩種我更喜歡這種方法，雖然正則有點難以理解。

replace 語法：str.replace(regexp|substr, newSubStr|function)

其中第一個 RegExp
對象或者其字面量所匹配的內容會被第二個參數的返回值替換。

function numFormat(num){
  var res=num.toString().replace(/\d+/, function(n){ // 先提取整數部分
       return n.replace(/(\d)(?=(\d{3})+$)/g,function($1){
          return $1+",";
        });
  })
  return res;
}

var a=1234567894532;
var b=673439.4542;
console.log(numFormat(a)); // "1,234,567,894,532"
console.log(numFormat(b)); // "673,439.4542"

　　

摘自：https://www.jianshu.com/p/928c68f92c0c