如何使用 JavaScript 检查数字是否有小数位或是否为整数?
在本教程中，我们将讨论如何使用 JavaScript 检查数字是小数还是整数。在 JavaScript 中，我们可以使用内置方法以及用户定义的方法来检查数字是否有小数位或是否为整数。我们将详细讨论所有这些方法。让我们看看我们可以使用哪些方法来完成这项任务。
以下方法对于检查数字是小数还是整数非常有用 -
使用 Math.floor() 方法。
使用 isInteger() 方法。
使用 isDecimal() 用户定义函数。
让我们通过代码示例逐一详细讨论上述所有方法 -
使用 Math.floor() 方法
floor() 方法是 JavaScript 中 Math 对象的内置方法。 floor 方法以数字作为参数，如果传递的数字是小数，则返回该数字的较低值或最低值。因此，我们可以用 floor 方法返回的最低值检查给定的数字，如果这两个值相同，则该数字为整数，否则该数字为小数。
语法
以下语法用于在 JavaScript 中实现 Math 对象的 floor() 方法 −
Math.floor(value);
让我们了解 floor 方法在检查数字是整数还是小数时的实际实现。
示例
以下示例将说明如何使用 Math.floor() 方法检查数字 −
<!DOCTYPE html>
<html>
<body>
<p>Enter a number below and click "Click to check" button to check if number has a decimale place or it's a whole number.</p>
<input type="number" id="input">
<p id="result"></p>
<button onclick="check()">Click to check</button>
<script>
var result = document.getElementById("result");
var inp = document.getElementById("input");
function check() {
var num = inp.value;
var number = Number(num);
if (number === Math.floor(number)) {
result.innerHTML = number + " is a whole number.";
} else {
result.innerHTML = number + " is a decimal number.";
}
}
</script>
</body>
</html>
在上面的例子中，我们使用了 Math.floor() 方法来检查一个数字是整数还是小数。
使用 isInteger()方法
isInteger()方法是JavaScript中Number对象的内置方法。 isInteger()方法接受一个数字并检查该数字是否为整数。 如果数字是整数，则返回true，否则返回false。
语法
以下语法用于实现Number对象的 isInteger()方法-
Number.isInteger(value);
让我们通过代码示例的实际实现来理解 isInteger()方法。
示例
下面的代码示例将解释如何使用 isInteger() 方法检查值 −
<!DOCTYPE html>
<html>
<body>
<h3>Check if a number has a decimal place or it’s a whole number</h3>
<p>Enter a number and click the below button</p>
<input type="number" id="input">
<p id="result"></p>
<button onclick="check()">Click to check</button>
<script>
var result = document.getElementById("result");
var inp = document.getElementById("input");
function check() {
var num = inp.value;
var number = Number(num);
if (Number.isInteger(number)) {
result.innerHTML = "<b> The given number " + number + " is a whole number not a decimal number. </b>";
} else {
result.innerHTML = "<b> The given number " + number + " is a decimal number not a whole number. </b>";
}
}
</script>
</body>
</html>
在上面的例子中，我们使用了isInteger()方法来检查一个数字是整数还是小数，我们可以看到代码正在运行。
使用isDecimal() - 用户定义函数
在 JavaScript 中，我们可以定义自己的方法来检查用户输入的数字是小数还是整数。在此方法中，我们将通过将数字除以 1 来检查数字，如果它完全被 1 除，则函数将返回值为 0，数字是整数。否则，数字是小数点数字。
语法
以下语法将详细说明如何将数字除以 1 以检查它是整数还是小数 -
var varName = number; var 检查 = varName % 1;
让我们借助代码示例了解如何实际实现 isDecimal() 方法。
算法
步骤 1 - 在第一步中，我们将定义一个类型为数字的输入标签，以获取用户输入的数字。
步骤 2 - 在此步骤中，我们将定义 isDecimal() 方法，该方法将输入数字作为参数，如果数字 id 为十进制，则返回 true，否则返回 false。
步骤 3 - 在下一步中，我们将为与按钮关联的 onclick 事件定义一个回调函数。
步骤 4 - 在最后一步中，我们将编写回调函数的逻辑并使用 isDecimal() 方法来检查数字是小数还是整数。
示例
以下示例是上述算法的代码实现，解释了isDecimal()如何检查输入数字是小数还是整数−
<!DOCTYPE html>
<html>
<body>
<h2>Checking using the isDecimal() method.</h2>
<p>Enter a number and check if a number has a decimal place or it’s a whole number</p>
<input type="number" id="input">
<p id="result"></p>
<button onclick="check()">Click to check</button>
<script>
var result = document.getElementById("result");
var inp = document.getElementById("input");
function isDecimal(num) {
return (num % 1);
}
function check() {
var num = inp.value;
var number = Number(num);
if (!isDecimal(number)) {
result.innerHTML = "<b> The given number " + number + " is a whole number not a decimal number. </b>";
} else {
result.innerHTML = "<b> The given number " + number + " is a decimal number not a whole number. </b>";
}
}
</script>
</body>
</html>
在此示例中，我们使用了isDecimal()方法来检查输入的数字是小数还是整数。我们在此示例中使用了Number()方法，这是因为我们从输入标签获取的值默认为字符串形式，因此为了将其转换为数字，我们使用了Number()方法。
因此，有三种方法可以检查数字是小数还是整数，我们在本教程中已经讨论过。我们通过实际实施了解了所有这些方法，然后借助与每种方法相关的代码示例。每当您需要检查数字是否有小数位或是否为整数时，都可以使用这些方法中的任何一种。
