Skip to main content

How to Remove "null" or "undefined" Values from a JavaScript Array

When processing data, it's a common and essential task to clean up arrays by removing "empty" values. Depending on your needs, "empty" could mean only null, it could mean both null and undefined (nullish values), or it could mean any "falsy" value. The Array.prototype.filter() method is the perfect tool for all of these scenarios.

This guide will teach you how to use filter() to create a new array with null and undefined values removed, and show you the concise idiomatic trick for removing all falsy values.

The Core Method: Array.prototype.filter()​

The filter() method is the standard, modern, and immutable way to create a new array containing only the elements from an original array that pass a certain test.

newArray = oldArray.filter(callbackFunction)

where:

  • callbackFunction: A function that is called once for each element.
  • If the callback returns true, the element is included in the new array.
  • If it returns false, the element is skipped.
note

filter() does not modify the original array.

Removing Only null Values​

If your goal is to remove only null and keep everything else (including 0, '', false, and undefined), you need an explicit comparison.

Problem:

// Problem: How to remove only the `null` values?
let mixedArray = ['apple', null, 0, 'banana', undefined, false];

Solution: provide a callback function that checks if the element is not strictly equal to null.

let mixedArray = ['apple', null, 0, 'banana', undefined, false];

let withoutNull = mixedArray.filter(item => {
  return item !== null;
});

console.log(withoutNull);

Output:

['apple', 0, 'banana', undefined, false]

Removing Both null and undefined (Nullish Values)​

A more common requirement is to remove both null and undefined, which are collectively known as "nullish" values.

Problem:

// Problem: How to remove both `null` and `undefined`?
let mixedArray = ['apple', null, 0, 'banana', undefined, false];

Solution: you can use a simple comparison with the loose inequality operator (!=), which is a rare but perfect use case for it. The expression item != null is true for everything except null and undefined.

let mixedArray = ['apple', null, 0, 'banana', undefined, false];

// The condition `item != null` is a concise way to check for both null and undefined.
let withoutNullish = mixedArray.filter(item => {
  return item != null;
});

console.log(withoutNullish);

Output:

['apple', 0, 'banana', false]
note

This is a clean and idiomatic way to remove nullish values while preserving other falsy values like 0, '', and false.

The Idiomatic Trick: Removing All Falsy Values​

Often, the goal is to clean an array of all values that could be considered "empty." In JavaScript, these are known as "falsy" values: false, 0, '' (empty string), null, undefined, and NaN.

Problem:

// Problem: How to remove all "empty" or falsy values?
let messyArray = ['apple', null, 0, 'banana', undefined, false, '', NaN];

Solution: you can achieve this with a very concise and idiomatic trick: passing the Boolean constructor directly to the filter() method.

let messyArray = ['apple', null, 0, 'banana', undefined, false, '', NaN];

let truthyOnly = messyArray.filter(Boolean);

console.log(truthyOnly);

Output:

['apple', 'banana']

How it works:

  • The filter() method automatically converts the return value of its callback to a boolean.
  • Falsy values are coerced to false and are filtered out, while truthy values are coerced to true and are kept.
  • filter(Boolean) is simply a shortcut that makes this coercion explicit and clear.

Conclusion​

The Array.prototype.filter() method is the definitive tool for removing unwanted values from an array in an immutable way.

  • To remove only null, use an explicit check: .filter(item => item !== null).
  • To remove both null and undefined (nullish values), use the loose inequality operator for a concise solution: .filter(item => item != null).
  • To remove all falsy values (null, undefined, 0, '', false, NaN), use the idiomatic shortcut: .filter(Boolean).

By choosing the right condition for filter(), you can precisely control which elements are kept in your new, cleaned array.

Table of Contents