JavaScript 中的 NaN 是什麼?
在本教程中,我們將學習 JavaScript 中的NaN。NaN 只是全域性物件的屬性,代表非數字。它主要用於檢查輸入的值是否為數字。NaN 和 Number.NaN 都是一樣的,所以下次如果在任何程式中寫了 Number.NaN,不要感到困惑,因為它與 NaN 相同。NaN 是一個很少在任何程式中使用的屬性,因為在程式中使用 NaN 來識別任何東西並不是一個好習慣。
有一個全域性的isNaN()方法可以完成此任務,如果傳遞給它的引數不是數字,則返回 true。否則,它將返回 false。
語法
以下語法將向您展示如何將變數賦值為 NaN,以及如何在 JavaScript 中使用 isNaN() 方法的語法:
Number.isNaN
OR
isNaN(Number);
在上面的語法中,我們已將變數賦值為 NaN 值,然後藉助 isNaN() 方法檢查它是否為 NaN。
讓我們透過實際實現程式碼示例來詳細瞭解 isNaN() 方法和 NaN 屬性的使用。
演算法
步驟 1 − 在演算法的第一步中,我們將在 HTML 文件中定義一個輸入標籤以獲取使用者輸入的值,以便它可以檢查任何型別的輸入。
步驟 2 − 在此步驟中,我們將定義一個帶有 onclick 事件的按鈕,以便在使用者單擊按鈕時稍後呼叫回撥函式。
步驟 3 − 在下一步中,我們定義一個 JavaScript 函式,該函式將作為回撥函式傳遞給上一步中定義的按鈕的 onclick 事件。
步驟 4 − 在最後一步中,我們將獲取使用者輸入的值,並使用isNaN()方法檢查它是否為數字,並編寫邏輯以根據提供的條件在螢幕上輸出合適的文字。
示例 1
要確定某個值是否為 NaN,請使用 Number.isNaN() 或 isNan() 方法。以下是一個檢查的示例:
<!DOCTYPE html> <html> <body> <button onclick="display()">Check</button> <p id="test"></p> <script> function display() { var a = ""; a += "isNaN(6234) : " + isNaN(6234); a += "<br>isNaN(-52.1) : " + isNaN(-52.1); a += "<br>isNaN('Hello') : " + isNaN('Hello'); a += "<br>isNaN(NaN) : " + isNaN(NaN); a += "<br>isNaN('') : " + isNaN(''); a += "<br>isNaN(0) : " + isNaN(0); a += "<br>isNaN(false) : " + isNaN(false); document.getElementById("test").innerHTML = a; } </script> </body> </html>
示例 2
下面的示例將解釋isNaN()方法的使用,以檢查輸入的值是數字還是非數字:
<!DOCTYPE html> <html> <body> <h4> Enter any value: </h4> <input type="text" id="inp1"> <br> <br> <p> Click the below button to check the entered value is a number or not a number (NaN). </p> <p id="result"> </p> <button onclick="display()"> Check here </button> <script> var result = document.getElementById("result"); function display() { var inp1 = document.getElementById("inp1"); var val1 = Number(inp1.value); var check = Number.isNaN(val1); if (check) { result.innerHTML += " The value you entered <b> " + val1 + " </b> is not a number (NaN). <br> "; } else { result.innerHTML += " The value you entered <b> " + val1 + " </b> is a number. <br> "; } } </script> </body> </html>
在上面的示例中,我們獲取了使用者輸入的值,然後使用Number方法將其轉換為數字,如果輸入值是整數,則將其轉換為數字資料型別。否則,它會將其轉換為NaN,然後在isNaN()方法內檢查它並輸出相應的語句。
讓我們再看一個示例,我們將NaN值賦給一個變數並對其進行操作。
演算法
步驟 1 − 在第一步中,我們將向 HTML 文件新增一個輸入標籤以獲取使用者的輸入以檢查任何型別的值。
步驟 2 − 在第二步中,必須定義一個帶有 onclick 事件的按鈕標籤,以便在使用者單擊按鈕時呼叫一個函式。
步驟 3 − 在最後一步中,我們將編寫我們的邏輯,在某些條件下將現有變數的值更改為 NaN,然後將結果顯示給使用者。
示例 3
以下示例將說明如何在需要時將 NaN 值賦給任何變數:
<!DOCTYPE html> <html> <body> <h2>NaN in JavaScript </h2> <h4> Enter a number: </h4> <input type="number" id="inp1"> <br> <br> <p> Click the below button to check the entered value is a number or not a number (NaN). </p> <p id="result"> </p> <button onclick="display()"> Check here </button> <script> var result = document.getElementById("result"); function display() { var inp = document.getElementById("inp1"); var val = Number(inp.value); if (val < 0 || val > 10) { val = Number.NaN; result.innerHTML += " The value you entered " + inp.value + " is now become <b> " + inp.value + " </b> Not a Number (NaN), because the value is either less than zero or greater than 10. <br> "; } else { result.innerHTML += " The value you entered <b>" + val + " </b> is a valid value. Hence, it is not changed to NaN. <br> "; } } </script> </body> </html>
在此示例中,我們在某些條件下已將現有變數的值更改為 NaN。
在本教程中,我們藉助程式碼示例瞭解了 JavaScript 中的 NaN 屬性是什麼,而在前一個示例中,我們檢查了輸入的值是數字還是非數字(NaN)。而在後者中,我們在程式碼中將 NaN 值賦給了一個已經存在的變數。
資料結構
網路
關係型資料庫管理系統
作業系統
Java
iOS
HTML
CSS
Android
Python
C 語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP