如何在 JavaScript 中检查一个值是否为数字？

在本教程中，我们将学习如何在 JavaScript 中检查一个值是否为数字。在 JavaScript 中，在执行某些操作时，有必要检查变量的数据类型。否则，它可能会在您的应用程序中产生一些未知的错误。

例如，当用户使用加法运算符与字符串一起使用时，它会 连接这两个字符串，并且以相同的方式，如果用户使用加法运算符与数字一起使用，它会将两个数字相加。现在，假设用户想要添加两个数字，但正在连接两个字符串。

这里，我们有三种不同的方法来检查一个变量是否为数字类型。

  • 使用 typeof 运算符

  • 使用 isNaN() 方法

  • 使用 Number.isFinite() 方法

使用 typeof 运算符

在这种方法中，我们将使用typeof 运算符来检查变量类型。它返回 变量的类型。如果返回值为“number”，则该变量为数字类型。

语法

用户可以使用以下语法来检查一个变量是否为数字，使用typeof 运算符。

let number = 20;
if ( typeof number == 'number' ) {
   
   // perform some operation with number.
}

示例

在下面的示例中，我们使用 typeof 运算符检查了不同变量的类型。它根据变量是否为数字在屏幕上打印消息。

<html>
<head>
</head>
<body>
   <h2>Check whether a value is number or not in JavaScript.</h2>
   <h4>Using the <i>typeof</i> operator to check value is number or not.</h4>
   <div id = "number1"></div>
</body>
   <script>
      var number1 = document.getElementById("number1");
      function checkNumber(number) {
      return typeof number == "number" ? "is number" : " is not a number";
      }
      number1.innerHTML = "123 " + checkNumber(123) + " <br/> ";
      number1.innerHTML += "true " + checkNumber(true) + " <br/> ";
      number1.innerHTML += "'Hello' " + checkNumber("Hello") + " <br/> ";
   </script>
</html>

使用 isNaN() 方法

在检查变量是否为数字的第二种方法中，我们将使用isNaN() 方法。NaN 的含义是“非数字”。isNaN() 方法 如果传递的参数值不是数字则返回 true；否则返回 false。

为了实现我们的目标，我们将取返回值的否定。因此，当变量为数字类型时，它将返回 true，而当变量为其他数据类型时，它将返回 false。

语法

let number = 20;
let result = !isNaN(number);

参数

  • number − 它是一个任意数据类型的变量，我们想要检查该变量是否为数字。

示例

在下面的示例中，我们使用了 isNaN() 方法来检查不同的变量是否为数字。我们还检查了布尔值。

<html>
<head>
</head>
<body>
   <h2>Check whether a value is number or not in JavaScript.</h2>
   <h4>Using the <i> isNaN() </i> method for different values.</h4>
   <div id = "number1"></div>
</body>
   <script>
      var number1 = document.getElementById("number1");
      number1.innerHTML = "-32.34 is number : " + !isNaN(-32.34) + " <br/>";
      number1.innerHTML += "false is number : " + !isNaN(false) + " <br/>";
      number1.innerHTML += "TutorialsPoint is number : " + !isNaN("TutorialsPoint") + " <br/> ";
   </script>
</html>

上述方法对布尔值返回 true，因为布尔值以 0 和 1 的形式表示。所以，这是 isNaN() 方法的局限性。它将对布尔值返回准确的结果。

使用 Number.isFinite() 方法

Number.isFinite() 方法是内置的 JavaScript 数字库 方法。它以一个变量作为参数，并对所有数值返回 true，除了 Infinity 值。

语法

let variable = 20;
let result = Number.isFinite( variable );

参数

  • variable − 它是一个任意数据类型的变量，用户想要检查该值是否为数字。

示例

下面的示例演示了 Number.isFinite() 方法的使用。我们正在测试不同的变量和值，以确定该变量是否为数字类型。

<html>
<head>
</head>
<body>
   <h2>Check whether a value is number or not in JavaScript.</h2>
   <h4>Using the <i> Number.isFinite() </i> method for different values.</h4>
   <div id = "number1"></div>
</body>
   <script>
      var number1 = document.getElementById("number1");
      number1.innerHTML = "232.14 is number : " + Number.isFinite(232.14) + " <br/> ";
      number1.innerHTML += "Infinity is number : " + Number.isFinite(Infinity) + " <br/> ";
      number1.innerHTML += "Yes is number : " + Number.isFinite("yes") + " <br/> ";
   </script>
</html>

我们学习了三种不同的方法来检查值是否为数字。第一种方法是最流行和最简单的方法。第二种方法对布尔值有一些限制，因此不推荐使用。第三种方法也很有用，因为它适用于所有变量。

更新于: 2023年9月14日

26K+ 浏览量

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告