如何格式化数字？

 function formatNumber1(number) {
var comma = ',',
string = Math.max(0, number).toFixed(0),
length = string.length,
end = /^\d{4,}$/.test(string) ? length % 3 : 0;
return (end ? string.slice(0, end) + comma : '') + string.slice(end).replace(/(\d{3})(?=\d)/g, '$1' + comma);
}


function formatNumber2(number) {
return Math.max(0, number).toFixed(0).replace(/(?=(?:\d{3})+$)(?!^)/g, ',');
}

资料来源: http://jsperf.com/number-format

使用 Number 函数 toFixed和此函数添加逗号。

function addCommas(nStr)
{
nStr += '';
var x = nStr.split('.');
var x1 = x[0];
var x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}
n = 10000;
r = n.toFixed(2); //10000.00


addCommas(r); // 10,000.00

Http://www.mredkj.com/javascript/numberformat.html

使用

num = num.toFixed(2);

其中2是小数位数

编辑:

下面的函数可以根据需要格式化数字

function formatNumber(number)
{
number = number.toFixed(2) + '';
x = number.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}

来源: Www.mredkj.com

这是一篇关于你的问题的文章。添加一个千分隔符不是内置在 JavaScript 中的，所以你必须像这样编写你自己的函数(从链接页面获得的例子) :

function addSeperator(nStr){
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
return x1 + x2;
}

我想有了这个 JQuery-numberformatter你就可以解决你的问题了。

当然，这是假设您在项目中使用 jQuery 没有问题。请注意，该功能与 很模糊事件相关联。

$("#salary").blur(function(){
$(this).parseNumber({format:"#,###.00", locale:"us"});
$(this).formatNumber({format:"#,###.00", locale:"us"});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


<script src="https://cdn.jsdelivr.net/gh/timdown/jshashtable/hashtable.js"></script>


<script src="https://cdn.jsdelivr.net/gh/hardhub/jquery-numberformatter/src/jquery.numberformatter.js"></script>


<input type="text" id="salary">

如果使用 jQuery，可以使用 格式或 数字格式插件。

这将得到逗号分隔的值，并将固定符号添加到末尾。

    nStr="1000";
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
x1 = x1.replace(rgx, '$1' + ',' + '$2');
}
commaSeperated = x1 + x2 + ".00";
alert(commaSeperated);

来源

因为 JasperV 发现的错误，说得好！我重写了我的旧代码。我想我只用它来表示小数点后两位的正值。

根据您试图实现的目标，您可能希望四舍五入或不四舍五入，因此这里有两个版本可以跨越这个鸿沟。

首先，四舍五入。

我已经介绍了 toFixed()方法，因为它能更好地处理精确到特定小数位的舍入，并且得到了很好的支持。不过，这确实会减缓事情的进展。

这个版本仍然分离小数，但是使用了与以前不同的方法。w|0部分移除小数。更多信息，这是一个 答得好。然后留下剩余的整数，将它存储在 k中，然后再从原始数字中减去它，留下小数本身。

此外，如果我们要考虑负数，我们需要 while 循环(跳过三位数) ，直到我们到达 b。在处理负数时，这个值被计算为1，以避免放入类似 -,100.00的内容

循环的其余部分与前面相同。

function formatThousandsWithRounding(n, dp){
var w = n.toFixed(dp), k = w|0, b = n < 0 ? 1 : 0,
u = Math.abs(w-k), d = (''+u.toFixed(dp)).substr(2, dp),
s = ''+k, i = s.length, r = '';
while ( (i-=3) > b ) { r = ',' + s.substr(i, 3) + r; }
return s.substr(0, i + 3) + r + (d ? '.'+d: '');
};

在下面的代码片段中，您可以编辑这些数字来测试自己。

function formatThousandsWithRounding(n, dp){
var w = n.toFixed(dp), k = w|0, b = n < 0 ? 1 : 0,
u = Math.abs(w-k), d = (''+u.toFixed(dp)).substr(2, dp),
s = ''+k, i = s.length, r = '';
while ( (i-=3) > b ) { r = ',' + s.substr(i, 3) + r; }
return s.substr(0, i + 3) + r + (d ? '.'+d: '');
};


var dp;
var createInput = function(v){
var inp = jQuery('<input class="input" />').val(v);
var eql = jQuery('<span>&nbsp;=&nbsp;</span>');
var out = jQuery('<div class="output" />').css('display', 'inline-block');
var row = jQuery('<div class="row" />');
row.append(inp).append(eql).append(out);
inp.keyup(function(){
out.text(formatThousandsWithRounding(Number(inp.val()), Number(dp.val())));
});
inp.keyup();
jQuery('body').append(row);
return inp;
};


jQuery(function(){
var numbers = [
0, 99.999, -1000, -1000000, 1000000.42, -1000000.57, -1000000.999
], inputs = $();
dp = jQuery('#dp');
for ( var i=0; i<numbers.length; i++ ) {
inputs = inputs.add(createInput(numbers[i]));
}
dp.on('input change', function(){
inputs.keyup();
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="dp" type="range" min="0" max="5" step="1" value="2" title="number of decimal places?" />

现在是另一个版本，没有四舍五入。

这采取了不同的途径，并试图避免数学计算(因为这可能会引入舍入或舍入误差)。如果你不想四舍五入，那么你只是处理事情作为一个字符串，即1000.999转换为两个小数位将永远只有1000.99，而不是1001.00。

这种方法避免使用 .split()和 RegExp()，但是，它们都是非常慢的比较。虽然我从 Michael 关于 toLocaleString的回答中学到了一些新的东西，但我也很惊讶地发现它是所有方法中速度最慢的(至少在 Firefox 和 Chrome; Mac OSX 中是这样)。

使用 lastIndexOf()，我们可以找到可能存在的小数点，从这里开始，所有的东西都差不多一样了。在需要的地方保存额外的0。此代码限制为小数点后5位。在我的测试中，这是最快的方法。

var formatThousandsNoRounding = function(n, dp){
var e = '', s = e+n, l = s.length, b = n < 0 ? 1 : 0,
i = s.lastIndexOf('.'), j = i == -1 ? l : i,
r = e, d = s.substr(j+1, dp);
while ( (j-=3) > b ) { r = ',' + s.substr(j, 3) + r; }
return s.substr(0, j + 3) + r +
(dp ? '.' + d + ( d.length < dp ?
('00000').substr(0, dp - d.length):e):e);
};

var formatThousandsNoRounding = function(n, dp){
var e = '', s = e+n, l = s.length, b = n < 0 ? 1 : 0,
i = s.lastIndexOf('.'), j = i == -1 ? l : i,
r = e, d = s.substr(j+1, dp);
while ( (j-=3) > b ) { r = ',' + s.substr(j, 3) + r; }
return s.substr(0, j + 3) + r +
(dp ? '.' + d + ( d.length < dp ?
('00000').substr(0, dp - d.length):e):e);
};


var dp;
var createInput = function(v){
var inp = jQuery('<input class="input" />').val(v);
var eql = jQuery('<span>&nbsp;=&nbsp;</span>');
var out = jQuery('<div class="output" />').css('display', 'inline-block');
var row = jQuery('<div class="row" />');
row.append(inp).append(eql).append(out);
inp.keyup(function(){
out.text(formatThousandsNoRounding(Number(inp.val()), Number(dp.val())));
});
inp.keyup();
jQuery('body').append(row);
return inp;
};


jQuery(function(){
var numbers = [
0, 99.999, -1000, -1000000, 1000000.42, -1000000.57, -1000000.999
], inputs = $();
dp = jQuery('#dp');
for ( var i=0; i<numbers.length; i++ ) {
inputs = inputs.add(createInput(numbers[i]));
}
dp.on('input change', function(){
inputs.keyup();
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="dp" type="range" min="0" max="5" step="1" value="2" title="number of decimal places?" />

我稍后将更新一个页面内的代码片段演示，但现在这里有一个小提琴:

Https://jsfiddle.net/bv2ort0a/2/

老方法

为什么要使用 RegExp 呢? 当牙签可以用的时候，不要使用锤子，比如使用字符串操作:

var formatThousands = function(n, dp){
var s = ''+(Math.floor(n)), d = n % 1, i = s.length, r = '';
while ( (i -= 3) > 0 ) { r = ',' + s.substr(i, 3) + r; }
return s.substr(0, i + 3) + r +
(d ? '.' + Math.round(d * Math.pow(10, dp || 2)) : '');
};

走过去

formatThousands( 1000000.42 );

小数点后第一位:

s = '1000000', d = ~ 0.42

从字符串的末尾开始向后查找:

',' + '000'
',' + '000' + ',000'

通过添加剩余的前缀和小数后缀(四舍五入到 dp小数点)来完成:

'1' + ',000,000' + '.42'

胡说八道

Http://jsfiddle.net/xc3ss/

或者您可以使用 Sugar Js库和 格式方法:

Format (place = 0，Millennium =’,’，decal =’.’) 将数字格式化为可读的字符串。如果位置未定义，将自动 确定地点。数千是用来表示数千的字符 小数是用于小数点的字符。

例子:

(56782).format() > "56,782"
(56782).format(2) > "56,782.00"
(4388.43).format(2, ' ') > "4 388.43"
(4388.43).format(3, '.', ',') > "4.388,430"

这大约是已接受答案的3倍快。它不会创建数组，并且避免在结尾创建对象和字符串串联。如果您呈现大量的值(例如在表中) ，这可能会很有用。

function addThousandSeparators(number) {
var whole, fraction
var decIndex = number.lastIndexOf('.')
if (decIndex > 0) {
whole = number.substr(0, decIndex)
fraction = number.substr(decIndex)
} else {
whole = number
}
var rgx = /(\d+)(\d{3})/
while (rgx.test(whole)) {
whole = whole.replace(rgx, '$1' + ',' + '$2')
}
return fraction ? whole + fraction : whole
}

让我也把我的解决方案放在这里。为了便于阅读，我给每一行都加了注释，并提供了一些示例，所以它看起来可能很大。

function format(number) {


var decimalSeparator = ".";
var thousandSeparator = ",";


// make sure we have a string
var result = String(number);


// split the number in the integer and decimals, if any
var parts = result.split(decimalSeparator);


// if we don't have decimals, add .00
if (!parts[1]) {
parts[1] = "00";
}
  

// reverse the string (1719 becomes 9171)
result = parts[0].split("").reverse().join("");


// add thousand separator each 3 characters, except at the end of the string
result = result.replace(/(\d{3}(?!$))/g, "$1" + thousandSeparator);


// reverse back the integer and replace the original integer
parts[0] = result.split("").reverse().join("");


// recombine integer with decimals
return parts.join(decimalSeparator);
}


document.write("10 => " + format(10) + "<br/>");
document.write("100 => " + format(100) + "<br/>");
document.write("1000 => " + format(1000) + "<br/>");
document.write("10000 => " + format(10000) + "<br/>");
document.write("100000 => " + format(100000) + "<br/>");
document.write("100000.22 => " + format(100000.22) + "<br/>");

如果要使用内置代码，可以将 toLocaleString()与 minimumFractionDigits一起使用。

当我第一次写这个答案时，toLocaleString()上扩展选项的浏览器兼容性 是有限的，但是当前状态看起来还不错。如果您正在使用 Node.js，你将需要 npm install的 intl包。

var value = (100000).toLocaleString(
undefined, // leave undefined to use the visitor's browser
// locale or a string like 'en-US' to override it.
{ minimumFractionDigits: 2 }
);
console.log(value);

不同区域性的数字格式有所不同。除非对输出进行字符串比较，否则 ¹最礼貌的做法是选择 undefined，并让访问者的浏览器使用他们最熟悉的.²格式

// Demonstrate selected international locales
var locales = [
undefined,  // Your own browser
'en-US',    // United States
'de-DE',    // Germany
'ru-RU',    // Russia
'hi-IN',    // India
'de-CH',    // Switzerland
];
var n = 100000;
var opts = { minimumFractionDigits: 2 };
for (var i = 0; i < locales.length; i++) {
console.log(locales[i], n.toLocaleString(locales[i], opts));
}

如果您来自不同的文化与上述格式不同，请 编辑这篇文章，并添加您的地区代码。

_{^{你不应该这样做。
2} 显然不要使用类似于 {style: 'currency', currency: 'JPY'}的 为了货币，除非你已经转换成本地汇率。你不希望你的网站告诉人们价格是300，而实际上是300美元。有时候真正的电子商务网站会犯这样的错误。}

简单来说:

var n = 1234567890;
String(n).replace(/(.)(?=(\d{3})+$)/g,'$1,')
// "1,234,567,890"

在浏览器 那种支持和 < em > ECMAScript 2016国际化 API 规格 (ECMA-402)上，你可以使用一个 Intl.NumberFormat实例:

var nf = Intl.NumberFormat();
var x = 42000000;
console.log(nf.format(x)); // 42,000,000 in many locales
// 42.000.000 in many other locales

if (typeof Intl === "undefined" || !Intl.NumberFormat) {
console.log("This browser doesn't support Intl.NumberFormat");
} else {
var nf = Intl.NumberFormat();
var x = 42000000;
console.log(nf.format(x)); // 42,000,000 in many locales
// 42.000.000 in many other locales
}

function numberWithCommas(x) {
x=String(x).toString();
var afterPoint = '';
if(x.indexOf('.') > 0)
afterPoint = x.substring(x.indexOf('.'),x.length);
x = Math.floor(x);
x=x.toString();
var lastThree = x.substring(x.length-3);
var otherNumbers = x.substring(0,x.length-3);
if(otherNumbers != '')
lastThree = ',' + lastThree;
return otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + lastThree + afterPoint;
}


console.log(numberWithCommas(100000));
console.log(numberWithCommas(10000000));

输出

一百万
一百万

您可能需要考虑使用 toLocaleString()

工作范例:

const number = 1234567890.123;


console.log(number.toLocaleString('en-US')); // US format


console.log(number.toLocaleString('en-IN')); // Indian format

在 Chrome v60和 v88中测试

资料来源: ToLocaleString () | MDN

                function formatThousands(n,dp,f) {
// dp - decimal places
// f - format >> 'us', 'eu'
if (n == 0) {
if(f == 'eu') {
return "0," + "0".repeat(dp);
}
return "0." + "0".repeat(dp);
}


/* round to 2 decimal places */
//n = Math.round( n * 100 ) / 100;
var s = ''+(Math.floor(n)), d = n % 1, i = s.length, r = '';
while ( (i -= 3) > 0 ) { r = ',' + s.substr(i, 3) + r; }
var a = s.substr(0, i + 3) + r + (d ? '.' + Math.round((d+1) * Math.pow(10,dp)).toString().substr(1,dp) : '');
/* change format from 20,000.00 to 20.000,00 */
if (f == 'eu') {
var b = a.toString().replace(".", "#");
b = b.replace(",", ".");
return b.replace("#", ",");
}
return a;
}