如何在 Javascript 中正确显示 2 位小数?

Question

我的网站上有问题。我在东西上的价格在点后用两位小数显示，例如 1.12，当我选择很多仓位时，总价变为 14.6199999999999997，这一切都是通过 JS 显示的。如何限制点后显示 2 个字符？使其全部可读，例如 15.77

我的代码：

function click() {
$('.de .item').click(function() {
var i = parseFloat($(this).attr('data-id'));
var price = parseFloat($(this).find('.price').find('b').text());
if($(this).hasClass('active')) {
delete(items[i]);
$(this).removeClass('active');
cost -= price;
} else {
items[i] = {
classid : $(this).attr('data-classid'),
assetid : $(this).attr('data-assetid')
};
$(this).addClass('active');
cost += price;
}
$('#total_cost').text(cost);
$('#skins_selected').text(getCount(items));
});
}

负责总价$('#total_cost').text(cost);的结论

我尝试这种方法$('#total_cost').text(cost).toFixed(2);它不想工作。我尝试$('#total_cost') = parseFloat(text(cost)).toFixed(2);它也不起作用。

如何正确输出？

Answer 1

$('#total_cost').text(cost.toPrecision(2));

或

function precise(num, precision = 2) {
return Number.parseFloat(num).toPrecision(precision);
}
$('#total_cost').text(precise(cost));

Answer 2

将数字固定为一组位数，然后将其作为字符串返回的方法为 toFixed。

但是，您应该真正意识到，您永远不应该使用浮动来跟踪货币。原因是 JavaScript(以及许多其他语言(在添加浮点数方面存在问题，这可能会导致许多意外的数据准确性错误，当您谈论金钱时，您永远不希望在值的存储或呈现方式上出现任何准确性错误。这与与浮点精度相关的一些技术细节有关。

为了简单演示我在说什么，请看这个有点令人困惑的例子：

Boolean(0.2 + 0.1 === 0.3) // Returns false

这里有一篇文章将有助于理解这个概念，称为"每个JavaScript开发人员都应该知道的关于浮点的知识">

存储货币的正确方法是使用整数加法与美分值进行转换，因此本质上100 === $1.00.然后，将其与 Intl.NumberFormat 类结合使用，以将存储的整数显示为货币。

有关这种存储和呈现货币方式的更多信息，请参阅此处。