JavaScript 如何将浮点数显示为两位小数

Question

我想将一个数字显示为小数点后2位。

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

然而，如果数字是 0.05 ，结果会得到 0.0500。我希望结果保持原样。

在 JSbin 上查看。

最佳的方法是什么？

我能想到一些解决方案，但我希望有内置的方法可以做到这一点。

- alex

Answer 1

float_num.toFixed(2);

注意：toFixed()会根据需要四舍五入或使用零填充以满足指定的长度。

- Jason McCreary

---

但它返回的是字符串，而不是浮点数！ - Anwar

问作者希望“显示”它，因此一个字符串是完美的。 - Christophe Marois

您可以始终使用parseFloat（float_num.toFixed（2））将字符串转换回浮点数，同时仅保留两位小数。 - Hankrecords

@anwar，你不能可靠地舍入一个浮点数（可以说你根本无法舍入一个浮点数）- 你会得到像0.0500或甚至是0.0500000000001这样的结果。请参考http://floating-point-gui.de/。 - jmc

@Hankrecords，你说的不对。如果我有'43.01'并使用parseFloat，那么我会得到43.01，但是如果我有'43.10'，我将得到43.1：D这不是我想要的。 - Lucian Tarna

Answer 2

您可以使用toFixed函数来实现，但在IE中存在错误。如果您想要一个可靠的解决方案，请查看我的答案此处。

- Elias Zamaria

---

技术应当不断发展，而不是适应IE浏览器。（顺便提一句，在Node.js中使用float_num.toFixed(2);可以正常工作。） - fider

IE昨天已经挂了。 - cantaş

Answer 3

number.parseFloat(2) 能够正常工作，但返回的是字符串。

如果想要保留数字类型，可以使用：

Math.round(number * 100) / 100

- rnmalone

---

这个的内部表示可能不是你想要的。很可能是你不想烦恼的东西-表达（和存储）很重要。把它看作与布尔值相同的方式来考虑。 - Herbert Van-Vliet

Answer 4

toFixed 可以帮助你设置小数点后的位数，例如：

let number = 6.1234
number.toFixed(2) // '6.12'

但是toFixed返回的是一个字符串，而且如果number根本没有小数点，它会添加多余的零。

但是toFixed返回的是一个字符串，如果number没有小数点，它将添加冗余的零。

let number = 6
number.toFixed(2) // '6.00'

要避免这个问题，您需要将结果转换为数字。您可以使用以下两种方法之一来实现此目的：

let number1 = 6
let number2 = 6.1234

// method 1
parseFloat(number1.toFixed(2)) // 6
parseFloat(number2.toFixed(2)) // 6.12

// method 2
+number1.toFixed(2) // 6
+number2.toFixed(2) // 6.12

- codegames

Answer 5

我不知道怎么会来到这个问题，但即使这个问题已经被问了很多年，我想要添加一个快速简单的方法，我一直都在使用它，而且从未让我失望：

var num = response_from_a_function_or_something();

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

- panos

---

为什么要使用 parseFloat()？它只应该在数字来自字符串时使用。 - alex

有时候，当我使用jQuery从一个元素中获取某个"data-"属性的值时，如果只使用toFixed方法会产生错误，需要使用parseFloat方法进行修复。 - panos

是的，这就是我上面所说的 如果它来自一个字符串。但总是使用它是不好的建议。 - alex

Answer 6

使用toFixed代替toPrecision。

- casablanca

Answer 7

function round(value, decimals) { return Number(Math.round(value+'e'+decimals)+'e-'+decimals); }

round(1.005, 2); // 返回 1.01

round(1.004, 2); // 返回 1 而不是 1.00

答案参考此链接: http://www.jacklmoore.com/notes/rounding-in-javascript/

- Huy Nguyen

Answer 8

如果您需要两位数字而不是字符串类型，则可以使用此方法。

    const exFloat = 3.14159265359;
    
    console.log(parseFloat(exFloat.toFixed(2)));

- l2D

Answer 9

您可以尝试混合使用 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>

- George-Paul B.

---

感谢您提供的优秀参考。 - Arman H

非常好的答案，它在数字为整数时保留，当数字为浮点数时进行调整。 - Philip Developer

Answer 10

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

以下是语法：

numObj.toFixed([digits])

digits 参数是可选的，默认值为0。返回类型为字符串而不是数字。但是您可以使用

将其转换为数字。

numObj.toFixed([digits]) * 1

它也可以抛出像 TypeError, RangeError 这样的异常。

这里是完整细节和浏览器兼容性。

- Sunil Garg