JavaScript NaN

Summary: in this tutorial, you’ll learn about the JavasScript NaN, how to check if a value is NaN, and how to handle NaN effectively.

Introduction to JavaScript NaN

JavaScript has the number type that allows you to represent numbers including integer and floating-point numbers. And JavaScript number has a special value called NaN, which stands for Not-aNumber.

The NaN is a property of the global object. The global object is the window object in web browsers:

window.NaNCode language: JavaScript (javascript)

And the global object in Node.js.

global.NaNCode language: CSS (css)

The NaN has the type number as shown in the following code:

console.log(typeof NaN); // numberCode language: JavaScript (javascript)

Checking if a value is NaN

JavaScript provides you with the global function isNaN() that returns true if its argument is NaN:

isNaN(valueToCheck)Code language: JavaScript (javascript)

For example:

const result = 100 + 0 / 0;
console.log(isNaN(result)); // trueCode language: JavaScript (javascript)

Why use NaN

JavaScript uses NaN as the result of a failed operation on numbers including:

  • Parsing numbers
  • Using undefined as an operand
  • Using NaN as an operand
  • Using indeterminate forms
  • Passing invalid arguments to a math function

Operations return NaN

1) Parsing numbers

In JavaScript, you can convert a numeric string to a number. For example:

const input = '100';
const num = parseInt(input);

console.log(num); // 100Code language: JavaScript (javascript)

If JavaScript cannot convert a string to a number, it returns NaN. In this case, NaN indicates that the parsing has failed. For example:

const input = 'X100';
const num = parseInt(input);

console.log(num); // NaNCode language: JavaScript (javascript)

It’s good practice to verify the parsing result using the isNaN function:

const input = 'X100';
const num = parseInt(input);

// set num to 0 if parsing failed
if (isNaN(num)) {
    num = 0;
}

console.log(num); // 0Code language: JavaScript (javascript)

In this example, the parsing has failed therefore it returned NaN. The condition isNaN(num) is true so that the number is assigned to 0.

2) Use undefined as an operand

An expression that uses undefined as an operand returns NaN. For example:

console.log(undefined * 2); // NaNCode language: JavaScript (javascript)

In practice, you’ll deal with undefined quite often. For example, when you access a non-existing property of an HTML element and use it in a calculation.

It’s good practice to avoid using undefined in calculation.

3) Using NaN as an operand

When an expression has the NaN, it always returns NaN. For example:

const result = 10 + 1 / NaN;

console.log(result); // NaNCode language: JavaScript (javascript)

4) Using indeterminate forms

When an arithmetical operation is in the indeterminate form, it returns NaN. For example:

const result = 10 + 0 / 0;
console.log(result); // NaNCode language: JavaScript (javascript)

5) Using invalid arguments of math functions

When a math function receives an invalid argument, it returns NaN. For example:

const result = Math.sqrt(-1);
console.log(result); // NaNCode language: JavaScript (javascript)

In this example, the Math.sqrt() that returns the square root of a number. Since it only accepts a non-negative number, passing -1 results in NaN.

Summary

  • NaN stands for Not-a-Number. It is a special value of the NaN property of the global object.
  • NaN indicates a failed operation on numbers.
  • Use isNaN() function to check if a value is NaN.

Was this tutorial helpful ?