DEV Community

Cover image for isNaN is like gambling
Raymond Ottun
Raymond Ottun

Posted on

isNaN is like gambling

isNaN is a nice function that checks if a value is not a number but has been the source of many sleepless nights and wasted weekends for developers. The reason for this is that isNaN is not a reliable way to check if a value is not a number. Let me show you some examples:

Example 1

This is the expected behavior of isNaN. It returns true if the value is not a number and false if it is a number. In this case, 'hello' is not a number so isNaN returns true. So far so good.

isNaN('hello') // true
Enter fullscreen mode Exit fullscreen mode

Example 2

This is where things start to get weird. The value is not a number but isNaN returns false.

isNaN('123') // false
Enter fullscreen mode Exit fullscreen mode

This is because isNaN converts the value to a number before checking if it is not a number. In this case, '123' is converted to 123 which is a number so isNaN returns false. So if you want to check if a value is not a number, you can use the following function:

Example 3

How about null? It is not a number so isNaN should return true right? Wrong. It returns false.

isNaN(null) // false
Enter fullscreen mode Exit fullscreen mode

null is converted to 0 before checking if it is not a number. Since 0 is a number, isNaN returns false.

Example 4

What if your value happens to be undefined?

isNaN(undefined) // true
Enter fullscreen mode Exit fullscreen mode

This is because undefined is converted to NaN before checking if it is not a number. Since NaN is not a number, isNaN returns true. In this case, isNaN works as expected.

Example 5

What if your value happens to be true or false which are not numbers or so you thought?

isNaN(true) // false
isNaN(false) // false
Enter fullscreen mode Exit fullscreen mode

isNaN will "helpfully" convert true to 1 and false to 0 before checking if they are not numbers. Since 1 and 0 are numbers, isNaN returns false.

Example 6

Have you ever mistakenly passed in "" or " " to isNaN? You are in for a surprise.

isNaN("") // false
isNaN(" ") // false
Enter fullscreen mode Exit fullscreen mode

The "brilliant" isNaN function will convert "" and " " to 0 before checking if they are not numbers. Since 0 is a number, isNaN returns false.

Example 7:

So for whatever reason, you find yourself checking if a Date object is not a number. What do you think will happen?

isNaN(new Date()) // false
Enter fullscreen mode Exit fullscreen mode

That's right. isNaN will convert the Date object to a number before checking if it is not a number. Since the Date object is converted to the number of milliseconds since January 1, 1970, 00:00:00 UTC, it is definitely a number so isNaN returns false.

Example 8

[] and {} behave differently when passed to isNaN further adding to the confusion.

isNaN({}) // true
isNaN([]) // false
Enter fullscreen mode Exit fullscreen mode

{} is converted to NaN before checking if it is not a number. Since NaN is not a number, isNaN returns true. On the other hand, [] is converted to 0 before checking if it is not a number. Since 0 is a number, isNaN returns false.

Conclusion:

If you want to save yourself from a lot of headaches, you should know that isNaN is a very unreliable way to check if a value is not a number. If you want to check if a value is not a number, you can use the following function:

function isNotANumber(value) {
  return typeof value === 'number' && isNaN(value);
}
Enter fullscreen mode Exit fullscreen mode

This function checks if the value is a number and if it is, it checks if it is NaN. If it is NaN, it returns true. Otherwise, it returns false.

isNotANumber('hello') // true
isNotANumber('123') // true
isNotANumber(null) // true
isNotANumber(undefined) // true
isNotANumber(true) // true
isNotANumber(false) // true
isNotANumber("") // true
isNotANumber(" ") // true
isNotANumber(new Date()) // true
isNotANumber({}) // true
isNotANumber([]) // true
Enter fullscreen mode Exit fullscreen mode

Top comments (1)

Collapse
 
doslk profile image
Doslk

Explore a world of excitement with LuckyWins Casino Bonuses Australia! From thrilling games to enticing promotions, LuckyWins offers an unforgettable gaming experience. Just like mastering the art of gambling, understanding the nuances of JavaScript's isNaN function requires strategy and perseverance. But fear not, as we delve into the intricacies of isNaN, let's channel the excitement of hitting the jackpot at LuckyWins. So, buckle up, grab your LuckyWins Casino Bonuses Australia, and embark on a journey where every spin and every code brings you closer to victory!