javascript - 为什么 JavaScript 返回的模数似乎不一致？

Question

这个问题已经有答案了:

Is floating point math broken? (33 个回答)

已关闭 4 年前。

我正在学习JavaScript我有一个页面显示两个用户输入的数字相除的结果。

我不喜欢那样(1 / 3)将用 3.333333333333... 填充整个结果框，所以我将结果设置为 .toFixed(4) 。但这的结果是 (4 / 2)返回2.0000而不仅仅是2 .

因此，为了解决这个问题，我检查是否 (answer % 1 == 0) ，在这种情况下它会正常显示答案，然后检查 (answer % 0.1 == 0) ，显示 answer.toFixed(1) ，依此类推，最终 else是.toFixed(4) .

这对于某些数字可以按预期工作，但对于其他数字则不然，我不明白为什么或在它不起作用的情况下出了什么问题。

示例:

• (2 / 5)返回0.4 。这满足第二个条件 (answer % 0.1 == 0) ，并返回answer.toFixed(1) ，显示0.4 。太棒了。

• (2 / 10)也可以工作并显示 0.2 ，以及类似 (2 / 7) 的内容正确地被推送到 else并显示0.2857 .

• (2 / 8)返回0.25 ，然后错误地显示 0.2500

• (2 / 20)正确返回并显示0.1

• (9 / 6)返回1.5 ，然后错误地显示 1.5000

• (2 / 4)返回0.5 ，但显示 0.5000 。它不满足所有条件并跳转到 else一句话，所以answer.toFixed(4)已使用。

为什么 JavaScript 考虑 (0.4 % 0.1 == 0)成为true ，但是(0.5 % 0.1 == 0)成为false ？

这是我当前的代码:

let num1 = parseFloat($("calcInput1").value);
let num2 = parseFloat($("calcInput2").value);
answer = num1 / num2;

if (answer % 1 == 0) {
    document.getElementById("calcResult").value = answer;
    alert("answer % 1 == 0");
} else if (answer % 0.1 == 0) {
    document.getElementById("calcResult").value = answer.toFixed(1);
    alert("answer % 0.1 == 0");
} else if (answer % 0.01 == 0) {
    document.getElementById("calcResult").value = answer.toFixed(2);
    alert("answer % 0.01 == 0");
} else if (answer % 0.001 == 0) {
    document.getElementById("calcResult").value = answer.toFixed(3);
    alert("else");
} else {
    document.getElementById("calcResult").value = answer.toFixed(4);
}  

Answer 1

我相信，您需要输出的内容可以通过以下方式实现:

var answer = +(num1 / num2).toFixed(4);

将使用 toFixed() 生成的字符串转换回数字有助于避免末尾的冗余零。此外，您根本不需要使用modulus运算符，也不需要面对与浮点算术精度相关的问题。

注意我使用了 unary plus将字符串转换回数字，如 MDN 上所述:

Unary plus is the fastest and preferred way of converting something into a number.

示例:

var button = document.getElementById("calc");
var in1 = document.getElementById("calcInput1");
var in2 = document.getElementById("calcInput2");
var out = document.getElementById("answer");

button.addEventListener("click", function()
{
    var num1 = in1.value, num2 = in2.value;
    var answer = +(num1 / num2).toFixed(4);
    out.value = answer;
});

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

<input type="text" id="calcInput1">
<input type="text" id="calcInput2">
<button type="button" id="calc">Calc</button>
<input type="text" id="answer">