In this article, we will explore how to determine whether a value in JavaScript is a number.
There are several techniques available to determine whether a value is numeric. The following methods are outlined below:
We will discuss each method one by one properly.
- Utilizing the typeof operator
- Utilizing the isNaN method
- Utilizing the Number.isFinite method
- Utilizing the Number.isInteger method
We will discuss each method one by one properly.
Utilizing the typeof operator
The typeof operator is utilized to determine the data type of a variable. We will use the typeof operator to verify if the variable is classified as a number type.
Demo 1:
We will determine whether a variable is a number by utilizing the typeof operator.
Code:
function isNumber(value) {
return typeof value === 'number';
}
console.log(isNumber(36));
console.log(isNumber('good'));
Output:
The output presented demonstrates that the initial value is numeric, while the subsequent value is non-numeric.
Demo 2:
We will demonstrate another example to determine whether a variable is a number by utilizing the typeof operator.
Code:
<html>
<head>
</head>
<body>
<h2>Checking whether the value is a number or not by utilizing the typeof() operator</h2>
<div id = "number"></div>
</body>
<script>
var num_val = document.getElementById("number");
function checkNumber(number) {
return typeof number == "number" ? "is number" : " is not a number";
}
num_val.innerHTML = "105 " + checkNumber(105) + " <br/> ";
num_val.innerHTML += "'Best' " + checkNumber("Best") + " <br/> ";
num_val.innerHTML += "true " + checkNumber(true) + " <br/> ";
</script>
</html>
Output:
In the output presented, it is evident that the initial value is a numeric entry, while both the second and third values do not represent numbers.
Utilizing the isNaN method
NaN represents "not a number." The isNaN function is employed to yield true when the given value is not a number, and it returns false when the value is indeed a number. By placing the logical NOT operator (!) before the method, as in "!isNaN", we obtain the inverse result. Therefore, if the input is not a number, the !isNaN function will return a Boolean value of "true." Conversely, if the input is a number, the !isNaN function will return a Boolean value of "false."
Demo 1:
We will determine whether a given value is numeric by employing the isNaN function.
Code:
function isNumber(value){
try{
if(isNaN(value)){
throw new Error("The provided value is not a number");
}
console.log("The provided value is a number");
}
catch(error){
console.log("Error occurred: ", error.message);
}
}
isNumber(60);
isNumber("75");
isNumber("JTP");
Output:
The output indicates that while the initial value is numeric, the subsequent two values do not represent numbers.
Demo 2:
We will explore an additional demonstration that involves verifying if a given value is numeric by employing the isNaN function.
Code:
<!DOCTYPE html>
<html>
<head>
<title>isNaN() method</title>
</head>
<body>
<h2>Checking if a value is a number or not in JavaScript utilizing the isNaN() method</h2>
<div id = "num"></div>
</body>
<script>
var num = document.getElementById("num");
num.innerHTML = " 56 is a number : " + !isNaN(56) + " <br/>";
num.innerHTML += "false is a number : " + !isNaN(false) + " <br/>";
num.innerHTML += "Good is a number : " + !isNaN(Good) + " <br/>";
</script>
</html>
Output:
In this output, we can observe that the initial value is a numerical figure, whereas both the second and third values do not represent numbers.
Utilizing the Number.isFinite method
The Number.isFinite function is employed to determine if a given variable holds a numeric value. If the value is indeed numeric, the function further assesses whether it is finite or infinite. When the value is both numeric and finite, the function will return true.
Demo 1:
We will verify whether a given value is a numeric type by employing the Number.isFinite method in conjunction with a try-catch block.
Code:
function isNumber(value){
try{
if(!(Number.isFinite(value))){
throw new Error("The provided value is not a number");
}
console.log("The provided value is a number");
}
catch(error){
console.log("Error occurred: ", error.message);
}
}
isNumber(2502);
isNumber("90");
isNumber("Hey");
Output:
It is evident that solely the initial value is numeric, while the remaining values do not represent numbers.
Demo 2:
We will examine an additional demonstration to determine if a given value is a numeric type by employing the Number.isFinite function.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Checking whether the variable value is a number or not by utilizing the Number.isFinite() method</title>
</head>
<body>
<h2>Using the <i> Number.isFinite() </i> method to check whether the given values are numbers or not</h2>
<div id = "num"></div>
</body>
<script>
var num = document.getElementById("num");
num.innerHTML = "232.14 is a number : " + Number.isFinite(232.14) + " <br/> ";
num.innerHTML += "56 is a number : " + Number.isFinite(56) + " <br/> ";
num.innerHTML += "Infinity is a number : " + Number.isFinite(Infinity) + " <br/> ";
num.innerHTML += "Hello is a number : " + Number.isFinite("Hello") + " <br/> ";
</script>
</html>
Output:
It is evident that the initial and second values are numerical, whereas the third and subsequent values are non-numeric.
Utilizing the Number.isInteger method
The Number.isInteger function is designed to determine if a given variable holds an integer value. However, it is important to note that the Number.isInteger function is not capable of evaluating floating-point numbers.
Demo 1:
We will verify whether a value is an integer by employing the Number.isInteger function.
Code:
function isNumber(value){
try{
if(!(Number.isInteger(value))){
throw new Error("The provided value is not a number.");
}
console.log("The provided value is a number.");
}
catch(error){
console.log("Error occurred -", error.message);
}
}
isNumber("96");
isNumber(55);
isNumber("JTP");
Output:
It can be observed that the values in the first and third positions are not numerical, whereas the value in the second position is indeed a number.
Demo 2:
We will observe an additional demonstration of verifying whether a given value is a number by employing the Number.isInteger method.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Checking whether the variable value is a number or not by utilizing the Number.isInteger() method</title>
</head>
<body>
<h2>Utilizing the <i> Number.isInteger() </i> method to check whether the given values are numbers or not</h2>
<div id = "num"></div>
</body>
<script>
var num = document.getElementById("num");
num.innerHTML = "84 is a number : " + Number.isInteger(56) + " <br/> ";
num.innerHTML += "Hey is a number : " + Number.isInteger("Hey") + " <br/> ";
num.innerHTML += "65.21 is a number : " + Number.isInteger(232.14) + " <br/> ";
</script>
</html>
Output:
It is observable that the initial value is a numerical digit, the second value does not represent a number, and the third value is a floating-point number rather than an integer. This explains why the Number.isInteger method is unable to identify the floating-point number.
Conclusion:
In this article, we have explored how to verify if a value in JavaScript is a number. We have learned that there are several techniques available to determine whether the value of a variable is numeric. These methods include the use of the typeof operator, the isNaN method, the Number.isFinite method, and the Number.isInteger method.