Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
What is a NaN property of a Number object in JavaScript?
In JavaScript, the NaN property is a special value that represents "Not a Number". It is a property of the Number object and can be accessed using Number.NaN.
The NaN property is usually produced as a result of an operation that cannot produce a meaningful result. For example, dividing 0 by 0 or trying to parse an invalid number will both produce NaN.
Common Operations That Produce NaN
console.log(Math.sqrt(-1)); // NaN
console.log(0/0); // NaN
console.log(parseInt("foo")); // NaN
console.log("hello" * 2); // NaN
NaN NaN NaN NaN
Key Property: NaN is Not Equal to Itself
It is important to note that NaN is not equal to any value, including itself. So, if you want to check if a value is NaN, you cannot use the == or === operators.
console.log(NaN === NaN); // false console.log(NaN == NaN); // false console.log(Number.NaN === Number.NaN); // false
false false false
Checking for NaN Values
Instead, you should use the isNaN() function or Number.isNaN() method:
let someValue = parseInt("hello");
console.log(isNaN(someValue)); // true
console.log(Number.isNaN(someValue)); // true
// Difference between isNaN() and Number.isNaN()
console.log(isNaN("hello")); // true (converts string first)
console.log(Number.isNaN("hello")); // false (stricter check)
true true true false
Syntax
Following is the syntax to represent a not a number:
NaN Number.NaN
We can call NaN from the Number objects, so even NaN represents Not a Number but a Property of a Number object.
Example: Validating Day of Month
<html>
<head>
<script>
function showValue() {
var dayOfMonth = 50;
if (dayOfMonth < 1 || dayOfMonth > 31) {
dayOfMonth = Number.NaN;
alert("Day of Month must be between 1 and 31.");
}
document.write("Value of dayOfMonth : " + dayOfMonth);
}
</script>
</head>
<body>
<p>Click the following to see the result:</p>
<form>
<input type="button" value="Click Me" onclick="showValue();" />
</form>
</body>
</html>
Example: Sum Function with parseInt
Let's create a function sum which takes two parameters and converts them into integers using parseInt():
<html>
<body>
<h2>NaN property of a Number object in JavaScript</h2>
<div id="output"></div>
<script>
function sum(a, b) {
let x = parseInt(a);
let y = parseInt(b);
let result = x + y;
return result;
}
let outputDiv = document.getElementById("output");
outputDiv.innerHTML += "Sum of 2 and 4.0 = " + sum(2, 4.0) + "<br>";
outputDiv.innerHTML += "Sum of 2 and 4 = " + sum("2", 4) + "<br>";
outputDiv.innerHTML += "Sum of Two and 4 = " + sum("Two", 4) + "<br>";
</script>
</body>
</html>
Here when we pass integers, string containing integers, or decimal values, we get valid results because all can be parsed. However, when we pass a string of alphabets like "Two", parseInt() returns NaN, resulting in NaN for the sum.
Example: Strict Type Checking
Let's modify the function to only accept strict number types:
<html>
<body>
<script>
function sum(a, b) {
if (typeof(a) === "number" && typeof(b) === "number") {
document.write("Sum: " + (a + b));
} else {
document.write("Result: " + NaN);
}
}
sum("2", 4); // Will output NaN because "2" is a string
</script>
</body>
</html>
Conclusion
NaN is JavaScript's way of representing invalid numeric operations. Always use Number.isNaN() for strict NaN checking, and remember that NaN is never equal to itself. Use NaN to handle cases where numeric operations fail gracefully.
741 Views
