JavaScript显示浮点数到小数点后两位


315

我想显示一个数字到小数点后两位。

我以为可以toPrecision(2)在JavaScript中使用。

但是,如果数字是0.05,我得到0.0500。我希望它保持不变。

JSbin上看到它。

做这个的最好方式是什么?

我可以考虑编写一些解决方案,但是我想(我希望)内置类似的东西吗?

Answers:


559
float_num.toFixed(2);

注意:toFixed()如果需要满足指定的长度,将舍入或填充零。


61
但是它返回字符串,而不是浮点数!
安华

38
问题作者想“展示”它,所以一个字符串是完美的
Christophe Marois

7
而且,您始终可以使用parseFloat(float_num.toFixed(2))将字符串转换回浮点数,同时仅保留两位小数。
Hankrecords '02

3
@anwar,您不能可靠地使浮点数四舍五入(可以说完全可以使浮点数四舍五入)-您将得到0.0500甚至0.0500000000001的值。请参阅floating-point-gui.de
jmc

2
@Hankrecords说的不是事实。如果我有'43 .01'并且我parseFloat然后我得到43.01但如果我有'43 .10'我将得到43.1:D不是我想要的。
Lucian Tarna '18



14

不知道我是怎么解决这个问题的,但是即使被问了已经有很多年了,我也想添加一种快速而简单的方法,并且它永远不会让我失望:

var num = response_from_a_function_or_something();

var fixedNum = parseFloat(num).toFixed( 2 );

1
为什么parseFloat()呢?仅当数字来自字符串时才应使用它。
Alex

3
在某些情况下,当我通过jquery从某个元素获取某些“ data-”属性值时,如果仅使用toFixed,则会产生错误。parseFloat对其进行了修复。
panos

2
是的,如果它来自字符串,那就是我上面的意思。但是使用它总是一个坏建议。
Alex


8

number.parseFloat(2) 可以,但是它返回一个字符串。

如果您想将其保存为数字类型,则可以使用:

Math.round(number * 100) / 100


4

您可以尝试混合Number()toFixed()

将目标号码转换为带有X位数字的漂亮字符串,然后将格式化的字符串转换为数字。

Number( (myVar).toFixed(2) )


请参阅以下示例:

var myNumber = 5.01;
var multiplier = 5;
$('#actionButton').on('click', function() {
  $('#message').text( myNumber * multiplier );
});

$('#actionButton2').on('click', function() {
  $('#message').text( Number( (myNumber * multiplier).toFixed(2) ) );
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<button id="actionButton">Weird numbers</button>
<button id="actionButton2">Nice numbers</button>

<div id="message"></div>


谢谢您的参考。
阿曼H

1

toFixed()方法使用定点表示法格式化数字。

这是语法

numObj.toFixed([digits])

digits参数是可选的,默认情况下为0。返回类型为字符串而不是数字。但是您可以使用将其转换为数字

numObj.toFixed([digits]) * 1

它也可以抛出异常喜欢TypeErrorRangeError

这是浏览器的全部细节和兼容性。



-1

我做了这个功能。它工作正常,但返回字符串。

function show_float_val(val,upto = 2){
  var val = parseFloat(val);
  return val.toFixed(upto);
}
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.