Remove undefined values from an Array in JavaScript

Total
10
Shares

In JavaScript, Arrays can consist of undefined, Null, and NaN values. There are several methods available to remove undefined values from an Array in JavaScript.

Remove undefined values from an Array using the filter() method

The filter() method creates a new array with all elements that pass the test implemented by the provided function. 

The function passed to the filter method gets invoked with each array element, and all the truthly values returned by the function will be added to a new Array.

  1. Call the Array.filter() method by passing a function to it
  2. The function is predicate and checks each element in an array is not equal to undefined.
  3. The filter() method will return the new Array, excluding the undefined values
const antivirusArr = ['Microsoft Defender', 'Norton Antivirus', undefined, 'BitDefender Antivirus', undefined, undefined];
const results = antivirusArr.filter(element => {
    return element !== undefined;
});

console.log(results);

Output

[ 'Microsoft Defender', 'Norton Antivirus', 'BitDefender Antivirus' ]

The filter method will not modify the contents of the original Array. It returns a new Array containing the elements that have satisfied the condition.

Remove undefined values from an Array using the forEach() method

Another approach is to use the forEach() method to traverse all the elements in an Array and push the elements that are not undefined to a new Array.

  • Create an empty Array that will store the output.
  • Using the forEach() method, iterate all the elements in an Array.
  • During each iteration, perform a conditional check if the values are not equal to undefined and if the condition is met, push the element to an empty array.
const antivirusArr = ['Microsoft Defender', 'Norton Antivirus', undefined, 'BitDefender Antivirus', undefined, undefined];
const output = []
antivirusArr.forEach(element => {
    if (element !== undefined) {
        output.push(element);
    }
});

console.log(output);

Output

[ 'Microsoft Defender', 'Norton Antivirus', 'BitDefender Antivirus' ]

Note: The function we pass to the forEach() method will get called while iterating each element of an Array.

Conclusion

We can use Array.prototype.filter() and Array.prototype.forEach() methods to remove undefined values from an Array in JavaScript. The main difference between these two methods is forEach() method loops over an array and executes the callback, but the filter() method executes the callback and checks its return value.

Leave a Reply

Your email address will not be published.

Sign Up for Our Newsletters

Get notified on the latest articles

You May Also Like
JavaScript String padStart()

JavaScript String padStart()

Table of Contents Hide padStart() ExamplepadStart() SyntaxpadStart() ParameterpadStart() Return ValueExample 1 – How padStart() method works in JavaScript?Example 2 – Working of padStart() method with default value In this tutorial,…
View Post
JavaScript String startsWith()

JavaScript String startsWith()

Table of Contents Hide startsWith() SyntaxstartsWith() ParametersstartsWith() Return ValueJavaScript String startsWith() examplesJavaScript startsWith() example with Position parameter In JavaScript, the startsWith() method determines whether the given string begins with a…
View Post