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

Qodo Takeover

Introducing Qodo Gen 1.0: Transform Your Workflow with Agentic AI

While many AI coding tools operate as simple command-response systems, Qodo Gen 1.0 represents the next generation: autonomous, multi-step problem-solving agents that work alongside you.

Read full post →

Top comments (0)

Some comments may only be visible to logged-in visitors. Sign in to view all comments.

nextjs tutorial video

Youtube Tutorial Series 📺

So you built a Next.js app, but you need a clear view of the entire operation flow to be able to identify performance bottlenecks before you launch. But how do you get started? Get the essentials on tracing for Next.js from @nikolovlazar in this video series 👀

Watch the Youtube series

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay