JS was added to the digital thousands separator

This article was originally Links: https://www.jianshu.com/p/928c68f92c0c

JavaScript implementation Thousands Separator

The conventional digital string into a digital format with thousands separator is a very common problem, one thousand separated format rules integer part of the number of each set of three, a "" section. Fractional part unsegmented.
Example: 19,351,235.235767
Here are a few common implementation method.

1. A method

The idea is to achieve digital conversion into character array, the entire array recirculation, three of each add a comma-separated, and finally merged into a string. Because delimiters are added sequentially from the back: for example be added after 1,234,567 1,234,567 123,456,7 instead, it can be an array of convenience, first reverse, reverse back again after the addition finished, the order is normal. It is noted that, it is necessary to separate the fractional part of the decimal number if the processing words.

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. Method Two

JS using built-in functions  toLocaleString

grammar: numObj.toLocaleString([locales [, options]])

toLocaleString() This method returns a string representing the figure in a particular locale.

var a=1234567894532;
var b=673439.4542;

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

Note that this function when using the basic area is not specified, returns the default locale, and the default string formatting options, so that different areas of digital formats may be some differences. Be sure to use the best locales parameter specifies the language used.
Note: The fractional part will leave only three rounded according to my test environment.

3. Method Three

Using regular expressions and replace function, the relative first two I prefer this method, though we are a bit difficult to understand.

replace syntax:str.replace(regexp|substr, newSubStr|function)

Wherein the first  RegExp
content object or a literal match will be replaced by the return value of the second parameter.

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" 

Reference reading:
1. Regular Expressions 30 minutes Start Tutorial
2. String.prototype.replace ()