Convert NULL/Undefined/NaN to 0 using JavaScript

# Table of Contents

1. Convert NULL/Undefined to 0 in JavaScript
2. Convert NaN to 0 using JavaScript

# Convert NULL/Undefined to 0 in JavaScript

Use the logical nullish assignment operator to convert null or undefined to 0, e.g. val ??= 0;.

The logical nullish assignment (??=) operator assigns the provided value to the variable if it's equal to null or undefined.

Copied!
let val = null;

val ??= 0;

console.log(val); // 👉️ 0

If the val variable stores a null or an undefined value, it gets set to 0.

If the variable stores any other value, the logical nullish assignment (??=) operator short-circuits and doesn't assign the value to the variable.

Notice that we used the let keyword to declare the val variable.

Variables declared using const cannot be reassigned.

# Convert NULL/Undefined to 0 using nullish coalescing

You can also use the nullish coalescing operator (??) to convert null or undefined to 0.

Copied!
let val = undefined;

val = val ?? 0;

console.log(val); // 👉️ 0

If the value to the left of the nullish coalescing operator (??) is equal to null or undefined, the value to the right is returned, otherwise, the value to the left of the operator is returned.

If the value to the left of the operator is not null or undefined, the variable gets assigned its current value.

Copied!
let val = 100;

val = val ?? 0;

console.log(val); // 👉️ 100

# Convert NULL or Undefined to 0 using the ternary operator

Alternatively, you can use the ternary operator.

If the value is equal to null or undefined, the operator will return 0, otherwise, the value is returned.

Copied!
let val = undefined;

val = val == null ? 0 : val;

console.log(val); // 👉️ 0

The ternary operator is very similar to an if/else statement.

If the expression to the left of the question mark is truthy, the operator returns the value to the left of the colon, otherwise, the value to the right of the colon is returned.

You can imagine that the value before the colon is the if block and the value after the colon is the else block.

The falsy values in JavaScript are null, undefined, false, 0, "" (empty string), NaN (not a number).

All other values are truthy.

If the val variable stores null or undefined, the expression before the question mark returns true and the ternary operator returns 0.

Copied!
let val = null;

val = val == null ? 0 : val;

console.log(val); // 👉️ 0

If the expression returns false, the operator returns the value that is stored in the val variable.

Notice that we used the loose equality operator (==) to check for both null and undefined.

Copied!
console.log(null == undefined); // 👉️ true

This is because when using the loose equality operator (==), null is equal to undefined.

# Convert NULL or Undefined to 0 using an if statement

An alternative approach is to use a simple if statement.

Copied!
let val = undefined;

if (val == null) {
  val = 0;
}

console.log(val); // 👉️ 0

Declaring the val variable with the let keyword allows us to reassign it if the stored value is equal to null.

Variables declared using const cannot be reassigned.

While this approach is a little more verbose, it's still quite easy to read.

# Convert NULL to 0 using the logical OR (||) operator

Alternatively, you can use the logical OR (||) operator.

Copied!
let val = null;

val = val || 0;

console.log(val); // 👉️ 0

The logical OR (||) operator returns the value to the right if the value to the left is falsy.

We don't explicitly check if the value is equal to null or undefined, we check if the value is falsy.

The value could be an empty string, undefined, Nan, etc.

In other words, the value to the right of the operator is a fallback in case the value to the left is falsy.

# Convert NaN to 0 using JavaScript

Use the logical OR (||) operator to convert NaN to 0, e.g. const result = val || 0;.

The logical OR (||) operator returns the value to the right if the value to the left is falsy.

Copied!
let val = NaN;

val = val || 0;

console.log(val); // 👉️ 0

The logical OR (||) operator returns the value to the right if the value to the left is falsy.

The falsy values in JavaScript are null, undefined, false, 0, "" (empty string), NaN (not a number).

In the example, we don't explicitly check if the value is equal to NaN, we check if the value is falsy.

The value could be an empty string, undefined, null, etc.

An easy way to think about it is that the value to the right of the operator is a fallback in case the value to the left is falsy.

# Convert NaN to 0 using Number.isNaN

Alternatively, you can explicitly check if the value is NaN.

Copied!
let val = NaN;

if (Number.isNaN(val)) {
  val = 0;
}

console.log(val); // 👉️ 0

Declaring the val variable with the let keyword allows us to reassign it if the stored value is equal to NaN.

Variables declared using const cannot be reassigned.

While this approach is a little more verbose, it's still easy to read and intuitive.

# Convert NaN to 0 using the ternary operator

Alternatively, you can use the ternary operator.

If the value is equal to NaN, the operator returns 0, otherwise, the value is returned.

Copied!
let val = NaN;

const result = Number.isNaN(val) ? 0 : val;

console.log(result); // 👉️ 0

The ternary operator is very similar to an if/else statement.

If the expression to the left of the question mark is truthy, the operator returns the value to the left of the colon, otherwise, the value to the right of the colon is returned.

You can imagine that the value before the colon is the if block and the value after the colon is the else block.

Note that we used the Number.isNaN() method to check if the value is NaN (not a number).

You shouldn't try to explicitly compare to NaN because NaN is the only value in JavaScript, which is not equal to itself.

Copied!
console.log(NaN === NaN); // 👉️ false

If you try to compare any other value to itself, the output would be true.

However, this is not the case with NaN.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

• TypeError: Cannot convert undefined or null to object in JS
• Convert Bytes to KB, MB, GB or TB using JavaScript