Updated June 27, 2023
Introduction to isNaN() JavaScript
In this article, we will learn about isNaN() JavaScript. We will try to split the function isNaN() word by word and analyze the meaning of the function. is and NaN is both 2 separate words. NaN abbreviation is Not a Number. Now if we include any helping verb in front of any word, give a question right. Here also, isNaN means checks given value is a Number or Not. isNaN() checks whether the value passed to it is true or false.
How does the isNaN() function work in JavaScript?
- isNaN() function always checks whether the value is a Number or Not a Number.
- isNaN() returns the Boolean value as output.
- Returned Boolean values are true or false.
- If the given value is a string, it returns true; if the given value is a number, it returns false.
Syntax:
isNaN(value);
value: Pass the required value to check whether it is a number or not.
Example: There is a situation if we want to add or subtract numbers. Let’s suppose the numbers we are getting are from 3rd party clients. Are we directly add or subtract those values? No, because We don’t know what those values are, whether numbers or strings. So, we first check whether it is a number or not by using the isNaN() function. If the number is in string form, we simply par the number. Later we will add or subtract.
Examples to Implement in isNaN() JavaScript
Below is the example of implementing in isNaN() JavaScript:
Example #1
Checking whether passing Strings are numbers or not
Code:
<!DOCTYPE html>
<html>
<body>
<font color="blue">
<h1 align="center">Checking Strings are Numbers or Not with isNaN() function</h1>
</font>
<script>
function checkStringsNumberOrNot()
{
var a="Amardeep";
var b="123";
var c='25/12/2019';
var d="123Param";
var e="Hi989";
var f="*&^%";
var g=123+"Hello";
document.write("is "+a+" not a number =>"+isNaN(a)+"<br>");
document.write("is "+b+" not a number =>"+isNaN(b)+"<br>");
document.write("is "+c+" not a number =>"+isNaN(c)+"<br>");
document.write("is "+d+" not a number =>"+isNaN(d)+"<br>");
document.write("is "+e+" not a number =>"+isNaN(e)+"<br>");
document.write("is "+f+" not a number =>"+isNaN(f)+"<br>");
document.write("is "+g+" not a number =>"+isNaN(g));
}
checkStringsNumberOrNot();
</script>
</body>
</html>
</body>
</html>
Output:
Explanation of the above code: Amardeep is not a number, so the function returns true. 123 is a number, so the function returns false. 25/12/2019 is not a number but a date, so the function returns true. 123Param is not a number, so the function returns true. Hi989 is not a number, so the function returns true. 8&^% is not a number, so the function returns true. 123Hello is not a number, so the function returns true. (123+” String”=String so becomes 123Hello).
Example #2
Checking whether passing integers are numbers or not
Code:
<!DOCTYPE html>
<html>
<body>
<font color="blue">
<h1 align="center">Checking Integers are Numbers or Not with isNaN() function</h1>
</font>
<script>
function checkIntegersNumberOrNot()
{
var a="989";
var b=23;
var c=-25;
var d=-5.21;
var e='+28.67F';
var f="87.23L";
var g='0';
document.write("is "+a+" not a number =>"+isNaN(a)+"<br>");
document.write("is "+b+" not a number =>"+isNaN(b)+"<br>");
document.write("is "+c+" not a number =>"+isNaN(c)+"<br>");
document.write("is "+d+" not a number =>"+isNaN(d)+"<br>");
document.write("is "+e+" not a number =>"+isNaN(e)+"<br>");
document.write("is "+f+" not a number =>"+isNaN(f)+"<br>");
document.write("is "+g+" not a number =>"+isNaN(g));
}
checkIntegersNumberOrNot();
</script>
</body>
</html>
Output:
Explanation of the above code: 989 is a number, so the function returns false. 23 is a number, so the function returns false. -25 is a number, so the function returns false. -5.21 is a number, so the function returns false. +28.67F is not a number, so the function returns true. 23L is not a number, so the function returns true. 0 is a number, so the function returns
Example #3
Checking whether passing predefined JavaScript values are numbers or not
Code:
<!DOCTYPE html>
<html>
<body>
<font color="blue">
<h1 align="center"> Checking Predefined JavaScript Values are Numbers or Not with isNaN() function</h1>
</font>
<script>
function checkPredefinedValuesNumberOrNot()
{
var a="true";
var b="false";
var c="undefined";
var d="null";
var e=0/0;
var f=NaN;
var g="NaN";
document.write("is "+a+" not a number =>"+isNaN(a)+"<br>");
document.write("is "+b+" not a number =>"+isNaN(b)+"<br>");
document.write("is "+c+" not a number =>"+isNaN(c)+"<br>");
document.write("is "+d+" not a number =>"+isNaN(d)+"<br>");
document.write("is "+e+" not a number =>"+isNaN(e)+"<br>");
document.write("is "+f+" not a number =>"+isNaN(f)+"<br>");
document.write("is "+g+" not a number =>"+isNaN(g));
}
checkPredefinedValuesNumberOrNot();
</script>
</body>
</html>
Output:
Explanation of the above code: true is not a number, so the function returns true. false is not a number, so the function returns true. Undefined is not a number, so the function returns true. null is not a number, so the function returns true. NaN(0/0) is not a number, so the function returns true. NaN without quotes is not a number, so the function returns true. NaN with quotes is not a number, so the function returns true.
Example #4
Number.isNaN()
Its checks passed value is NaN, and its type is number. It is an updated version of the isNaN() direct-using function. It also returns true or false based on the value provided to it.
Code:
<!DOCTYPE html>
<html>
<body>
<font color="blue">
<h1 align="center">Check with Number.isNaN() whether values are Number or Not</h1>
</font>
<script>
function checkValuesNumberOrNot()
{
var a=10;
var b="false";
var c=0/0;
var d=-21.7;
var e=Number.NaN
document.write("is "+a+" not a number =>"+Number.isNaN(a)+"<br>");
document.write("is "+b+" not a number =>"+Number.isNaN(b)+"<br>");
document.write("is "+c+" not a number =>"+Number.isNaN(c)+"<br>");
document.write("is "+d+" not a number =>"+Number.isNaN(d)+"<br>");
document.write("is "+e+" not a number =>"+Number.isNaN(e));
}
checkValuesNumberOrNot();
</script>
</body>
</html>
Output:
Explanation of the above code: 10 is a number, so the function returns false. false is a number, so the function returns false. NaN (0/0) is not a number, so the function returns true. -21.7 is a number, so the function returns false. NaN (Number.NaN) is not a number, so the function returns true.
Note:
- Number.isNaN() returns the false and true output as false only because it considers false as 0 and true as 1 here.
- Function isNaN continuously checks whether the value inside the function is a number or not, whether in single quotes, double quotes, or no quotes.
Conclusion
isNaN() function is used to figure out whether a given value is a number or not. If the given value is a number, then return false otherwise, return true.
Recommended Articles
This is a guide to isNaN() JavaScript. Here we discuss an introduction, how isNaN() JavaScript works, and examples to implement. You can also go through our other related articles to learn more –