How do you test for NaN in JavaScript?

Malvolio picture Malvolio · May 19, 2015 · Viewed 45.5k times · Source

I have a variable x and I want to test if x is set to NaN. How do I do that?

My first instinct is probably to, you know, test it, like this:

if (x === NaN) {  ...

Silly rabbit, no, that would be far too easy. NaN is like NULL in SQL, it is not equal to anything, even itself.

But look, there is a function called isNaN() -- maybe that will do it!

No, so far as I can tell, isNaN() is utterly worthless.

For example, isNaN([""]) properly returns false, but isNaN(["."]) returns true. You don't want do know how I learned about this flaw.

How do I do this?

Turns out, my question is a duplicate of this one, but the selected answer is wrong. The right answer has 20% as many upvotes.

Answer

dopeddude picture dopeddude · Mar 10, 2016

Short Answer

For ECMAScript-5 Users:

#1
if(x !== x) {
    console.info('x is NaN.');
}
else {
    console.info('x is NOT a NaN.');
}

For people using ECMAScript-6:

#2
Number.isNaN(x);

And For consistency purpose across ECMAScript 5 & 6 both, you can also use this polyfill for Number.isNan

#3
//Polyfill from MDN
Number.isNaN = Number.isNaN || function(value) {
    return typeof value === "number" && isNaN(value);
}
// Or
Number.isNaN = Number.isNaN || function(value) {     
    return value !== value;
}

Note: I prefer to test using #1 which works same all places and does not have dependency on latest JS also. (It always gives me correct result. No surprises!)


Detailed Explanation:

Here is our awesome NaN

NaN == NaN; // false
NaN === NaN; // false

Please don't blame JavaScript for this, it is NaN which is supposed to behave this way in other languages also Which is fine as per rationale for all comparisons returning false NaN values

So comes isNaN as our savior, but wait it acts little differently in some scenarios like

isNaN(undefined); // true
isNaN({});        // true
isNaN("lorem ipsum"); // true

I had some strange faces by seeing the results above. And here comes reason from MDN

When the argument to the isNaN function is not of type Number, the value is first coerced to a Number. The resulting value is then tested to determine whether it is NaN.

So how should we test NaN for the non-numbers variables at all? I always go by the following

if(x !== x) {
    console.info('Is a NaN');
}
else {
    console.info('Not a NaN');
}

ECMAScript-6/JavaScript-2015 Updates

Do we have anything in ECMAScript-6 for the same. Yup we do...

Number.isNaN(x); // true

The ES6 implementation will also be helpful for the above cases like

Number.isNaN(undefined); // false
Number.isNaN({}); // false    
Number.isNaN("lorem ipsum"); // false

whereas ECMAScript-5 global function isNaN outputs in true for the above cases, which sometimes may not align with our expectation.