The number type in JavaScript holds integers and floats:

javascript

const integer = 4;const float = 1.5;typeof integer; // => 'number'typeof float; // => 'number'

Plus there are 2 special number values: `Infinity`

(a number bigger than any other number) and `NaN`

(representing "Not A Number" concept):

javascript

const infinite = Infinity;const faulty = NaN;typeof infinite; // => 'number'typeof faulty; // => 'number'

While working directly with `NaN`

is rare, it can appear surprisingly after a failed operation on numbers.

Let's take a closer look at `NaN`

special value: how to check if a variable has `NaN`

, and importantly understand the scenarios that create "Not A Number" values.

## 1. NaN number

The number type in JavaScript is a set of all number values, including "Not A Number", positive infinity and negative infinity.

"Not A Number" can be accessed using a special expression `NaN`

, or as a property of the global object or `Number`

function:

javascript

typeof NaN; // => 'number'typeof window.NaN; // => 'number'typeof Number.NaN; // => 'number'

"Not a Number" is a value that does not represent a real number, despite having number type. `NaN`

is useful to represent faulty operations on numbers.

For example, multiplying a number with `undefined`

is not a valid operation, thus the result is `NaN`

:

javascript

1 * undefined; // => NaN

Also trying to parse an invalid numeric string like `'Joker'`

results in `NaN`

too:

javascript

parseInt('Joker', 10); // => NaN

The section 3. Operations resulting in NaN details into the operations that generate `NaN`

.

## 2. Checking for equality with NaN

The interesting property of `NaN`

is that it doesn't equal to any value, even with the `NaN`

itself:

javascript

NaN === NaN; // => false

This behavior is useful to detect if a variable is `NaN`

:

javascript

const someNumber = NaN;if (someNumber !== someNumber) {console.log('Is NaN');} else {console.log('Is Not NaN');}// logs "Is NaN"

`someNumber !== someNumber`

expression is `true`

only if `someNumber`

is `NaN`

. Thus the above snippet logs to console `"Is NaN"`

.

JavaScript has bult-in functions to detect `NaN`

: `isNaN()`

and `Number.isNaN()`

:

javascript

isNaN(NaN); // => trueisNaN(1); // => falseNumber.isNaN(NaN); // => trueNumber.isNaN(1); // => false

The difference between these functions is that `Number.isNaN()`

doesn't convert its argument to a number:

javascript

isNaN('Joker12'); // => trueNumber.isNaN('Joker12'); // => false

`isNaN('Joker12')`

converts the argument `'Joker12'`

into a number, which is `NaN`

. Thus the function returns `true`

.

On the other side, `Number.isNaN('Joker12')`

checks without conversion if the argument is `NaN`

. The function returns `false`

because `'Joker12'`

doesn't equal `NaN`

.

## 3. Operations resulting in NaN

### 3.1 Parsing numbers

In JavaScript you can transform numeric strings into numbers.

For example, you could easily transform the `'1.5'`

string into a `1.5`

float number:

javascript

const numberString = '1.5';const number = parseFloat(numberString);number; // => 1.5

When the string cannot be converted to a number, the parsing function returns `NaN`

: indicating that parsing has failed. Here are some examples:

javascript

parseFloat('Joker12.5'); // => NaNparseInt('Joker12', 10); // => NaNNumber('Joker12'); // => NaN

When parsing numbers, it's a good idea to verify if the parsing result is not `NaN`

:

javascript

let inputToParse = 'Invalid10';let number;number = parseInt(inputToParse, 10);if (isNaN(number)) {number = 0;}number; // => 0

The parsing of `inputToParse`

has failed, thus `parseInt(inputToParse, 10)`

returns `NaN`

. The condition `if (isNaN(number))`

is `true`

, and `number`

is assigned to `0`

.

### 3.2 *undefined* as an operand

`undefined`

used as an operand in arithmetical operations like addition, multiplication, etc. results in `NaN`

.

For example:

javascript

function getFontSize(style) {return style.fontSize;}const fontSize = getFontSize({ size: 16 }) * 2;const doubledFontSize = fontSize * 2;doubledFontSize; // => NaN

`getFontSize()`

is a function that accesses the `fontSize`

property from a style object. When invoking `getFontSize({ size: 16 })`

, the result is `undefined`

(`fontSize`

property does not exist in `{ size: 16 }`

object).

`fontSize * 2`

is evaluated as `undefined * 2`

, which results in `NaN`

.

"Not A Number" is generated when a missing property or a function returning `undefined`

is used as a value in arithmetical operations.

Making sure that `undefined`

doesn't reach arithmetical operations is a good approach to prevent `NaN`

. Feel free to check "7 Tips to Handle undefined in JavaScript".

### 3.3 *NaN* as an operand

`NaN`

value is also generated when an operand in aritemtical operations is `NaN`

:

javascript

1 + NaN; // => NaN2 * NaN; // => NaN

`NaN`

spreads across the arithmetical operations:

javascript

let invalidNumber = 1 * undefined;let result = 1;result += invalidNumber; // appendresult *= 2; // duplicateresult++; // incrementresult; // => NaN

Operations on `result`

variable are broken after `invalidNumber`

value (which has `NaN`

) is appended to `result`

.

### 3.4 Indeterminate forms

`NaN`

value is created when arithmetical operations are in indeterminate forms.

The division of `0 / 0`

and `Inifinity / Infinity`

:

javascript

0 / 0; // => NaNInfinity / Infinity; // => NaN

The multiplication of `0`

and `Infinity`

:

javascript

0 * Infinity; // => NaN

Additions of infinite numbers of different signs:

javascript

-Infinity + Infinity; // => NaN

### 3.5 Invalid arguments of math functions

The square root of negative number:

javascript

Math.pow(-2, 0.5); // => NaN(-2) ** 0.5; // => NaN

Or the lograrithm of a negative number:

javascript

Math.log2(-2); // => NaN

## 4. Conclusion

"Not A Number" concept, expressed in JavaScript with `NaN`

, is useful to represent faulty operations on numbers.

`NaN`

doesn't equal to any value, even with `NaN`

itself. The recommended way to check if a variable contains `NaN`

is to use `Number.isNaN(value)`

.

Transforming numeric strings to numbers, when failed, could result in "Not A Number". It's a good idea to check whether `parseInt()`

, `parseFloat()`

or `Number()`

don't return `NaN`

.

`undefined`

or `NaN`

as an operand in arithmetical operations usually result in `NaN`

. Correct handling of `undefined`

(providing defaults for missing properties) is a good approach to prevent this situation.

Indeterminate forms or invalid arguments for mathematical functions also result in "Not A Number". But these cases happen rarely.

Here's my pragmatic advice: "Got `NaN`

? Search for `undefined`

!"