example

So let’s take a look at this example,

isNaN(NaN);

isNaN('A String');

isNaN(undefined);

isNaN({});

Number.isNaN(NaN);

Number.isNaN('A String');

Number.isNaN(undefined);

Number.isNaN({});Copy the code

If you know the answer, you can skip this article. Not clear friends, let’s take our time to analyze.

Here are the answers:

isNaN(NaN); // true

isNaN('A String'); // true

isNaN(undefined); // true

isNaN({}); // true

Number.isNaN(NaN); // true

Number.isNaN('A String'); // false

Number.isNaN(undefined); // false

Number.isNaN({}); // falseCopy the code

Why does a function that looks the same get different results?

What is NaN?

Before I explain NaN, I want to explain the confusing concepts of type/value/variable, so you can skip this section if you are already familiar with it

What is type/value/variable

In JavaScript, there are seven types of value

  1. null
  2. undefined
  3. boolean
  4. number
  5. string
  6. object
  7. Symbol (new in ES6)

So, what is variable? That’s what we declare after var.

The relationship between type, value and variable can be said as follows: “Variable” is the container storing value, while value has the concept of “type”, but “variable” does not have the concept of “type”, for example


var a = 'foo';Copy the code

The container variable A holds value ‘foo’, whose type is string

NaN

MDN describes it this way

The global NaN property is a value representing Not-A-Number.

NaN is A value placed in the global object, which is A not-a-number value.

The meaning is still vague.

So we’re looking at the description in the Divine book You Don’t Know JS

NaN literally stands for “not a number”, though this label/description is very poor and misleading, It would be much more accurate to think of NaN as being “invalid number,” “failed number,” or even “bad number,” than to think of it as “not a number.”

From the last summary, we know that NaN is a value whose type is number.

But instead of a normal value where type is number, NaN stands for ‘Not a number’.

So how do you tell if a value is a NaN?

isNaN()

Some people may say, is it not easy to judge? A direct comparison would be fine.

NaN= = =NaN // falseCopy the code

NaN returns false when compared to itself.

Therefore, we need a special function to determine whether a value is a NaN.

IsNaN () was born out of nowhere.

Let’s go back to the example above

isNaN(NaN); // trueCopy the code

OK, it worked, it looks perfect, but let’s go on to the following example

isNaN('A String'); // true

isNaN(undefined); // true

isNaN({}); // trueCopy the code

You see that a value that is clearly not a NaN is also misjudged as a NaN.

This BUG has been around for 20 years, since the very beginning of JavaScript. It is clear that the original designers, when designing isNaN(), were limited to the literal meaning of “Not a Number” : return true if it is Not a Number.

So ES6 introduced Number.isnan () to fix this BUG (rather than fix it, because isNaN was around for so long that it was possible that a lot of functionality was based on it).

Number.isNaN(NaN); // true

Number.isNaN('A String'); // false

Number.isNaN(undefined); // false

Number.isNaN({}); // falseCopy the code

Look back at the example above to see what was fixed.

Number. The isNaN () polyfill

In the absence of ES6, the following polyfills can be used

if (!Number.isNaN) {
  Number.isNaN = function(n) {
    return (
      typeof n === "number" &&
      window.isNaN( n )
    );
  };
}Copy the code

In simple terms, we add a type to isNaN() because the type of NaN is number.

There is an even simpler implementation

if (!Number.isNaN) {
    Number.isNaN = function(n) {
        returnn ! == n; }; }Copy the code

Takes advantage of the fact that only NaN is not equal to itself.

Just to poke fun at MDN’s interpretation, here’s how he explained isNaN()

You could think of isNaN as:

var isNaN = function(value) {
    return Number.isNaN(Number(value));
}Copy the code

He interprets the old isNaN() function based on the new ES6 function number.isnan ().

But why is isNaN() there

isNaN('A String'); // true

isNaN(undefined); // true

isNaN({}); // trueCopy the code

That’s the case.

The author blog

The author weibo