DEV Community

loading...
Cover image for 3 ways to check if variable is a number in JavaScript

3 ways to check if variable is a number in JavaScript

sanchithasr profile image Sanchithasr ・2 min read

I was building a form the other day in Vue and I had to write number validation for the field so had to write the logic to check whether the input value is number or not. I wanted to list out the few ways I learnt which might be helpful to others.

NOTE: In JavaScript, special values like NaN, Infinity and -Infinity are numbers too - though, we'll be ignoring those values.

1) Using isNan()

The isNaN() determines whether a value is NaN or not. We can take advantage of this to determine whether a variable is number type or not.

var numberOfpushUpsToday = 34; 

if(!isNaN(numberOfpushUpsToday)){
    console.log('It is a number')
}
else {
    console.log('It is not a number')
}
Enter fullscreen mode Exit fullscreen mode
!isNaN(34) // returns true
!isNaN('34') // returns true
!isNaN('Hello') // returns false
!isNaN(true) // returns true
!isNaN(false) // returns true 
!isNaN('undefined') // returns false
Enter fullscreen mode Exit fullscreen mode

Limitations:

1) It returns true for the Boolean values because the Boolean values are converted to numbers 0 and 1 accordingly so it would be misleading sometimes.
2) We have same issue for the null value as well. It returns true and hence one has to be careful while writing the code.

2) Using typeof()

The typeof operator returns a string indicating the type of the unevaluated operand.

num = 45
strng = '34'
typeof num // returns 'number'
typeof strng // returns "string"
typeof undefined // returns "undefined"
typeof null // returns "object"
Enter fullscreen mode Exit fullscreen mode

If the variable is type number, it would return the string number. We can use this to determine if the variable is number type.

var numberOfpushUpsToday = 34; 

if(typeof numberOfpushUpsToday === 'number' ){
    console.log('It is a number')
}
else {
    console.log('It is not a number')
}
Enter fullscreen mode Exit fullscreen mode

The typeof() performs much better than isNaN(). It correctly determines that a string variable, null and Boolean values are not numbers.

3) Using Number.isFinite()

The function isFinite() determines if the passed value is finite. The arguments are first converted to numbers and then checks if the value is finite and hence this is the most best way among all the methods mentioned above.

Number.isFinite(34) // returns true
Number.isFinite('Hello') // returns false
Number.isFinite(undefined) // returns false
Number.isFinite(true) // returns false
Number.isFinite(null) // returns false
Enter fullscreen mode Exit fullscreen mode
var numberOfpushUpsToday = 34; 

if(Number.isFinite(numberOfpushUpsToday) ){
    console.log('It is a number')
}
else {
    console.log('It is not a number')
    }
Enter fullscreen mode Exit fullscreen mode

Conclusion:

Although these methods can get tricky with Boolean values, undefined and null, they are helpful in solving some problems in day to day life. One just have to be careful while writing the code according to their needs.

And that sums it up!!!
Thank you..
Comment below if you have any feedback or thoughts.

Discussion (7)

Collapse
sanchithasr profile image
Sanchithasr Author

This is clever.

Collapse
alexmustiere profile image
Alex Mustiere

typeof is an operator, not a function, see developer.mozilla.org/en-US/docs/W...

Collapse
sanchithasr profile image
Sanchithasr Author

Fixed it. Thanks.

Collapse
michaelcurrin profile image
Michael

What about adding:

Number.isFinite("34") // false
Enter fullscreen mode Exit fullscreen mode
Collapse
lyrod profile image
Lyrod

Number.isNaN

Collapse
sanchithasr profile image
Forem Open with the Forem app