如何在 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+ 瀏覽量

開啟你的 職業生涯

透過完成課程獲得認證

開始學習
廣告