How To Remove Undefined Values from An Array Using JavaScript

Remove Undefined Values from an Array using JavaScript

We will get to know some ways to remove undefined values from an array using JavaScript. Either way is rather straightforward, and you can choose whichever you want.

Remove undefined values from an array using JavaScript

Using filter() method

The filter() function creates a copy of a part of the given array filtered to those elements in the given array that pass the test executed by the callbackFn function.

Syntax:

filter(callbackFn)

Parameter:

  • callbackFn: a function that will return a boolean value true or false.

You can pass a function name to this function and it will use that function (corresponding to passed function name) to check whether the value is undefined or not.

let array = ['learn',undefined,'share',null,'it'];

// filter out any value that is undefined
array = array.filter(Boolean);

console.log(array);

Output: 

 ['learn', 'share', 'it']

The above example uses the filter method with its parameter is the Boolean function. This Boolean function will return false if the element is an undefined object or a null object. Hence the filter() method will remove any value that the Boolean function returns false, you can easily remove undefined values from an array by using this method. 

Using a for loop with splice()

The previous solution will create a copy of an array to do the task, which means it will consume a lot of memory if your array is large. To deal with this, you can use a for loop and remove any undefined values by using the splice method. 

The syntax and usage of this splice() function is introduced here.

let array = ['learn',undefined,'share',null,'it'];

// iterate through all elements and check if it is undefined
for (let i = 0 ; i < array.length; i++)
   if (array[i] == undefined) 
      array.splice(i,1);

console.log(array);

Output: 

 ['learn', 'share', 'it']

The logic behind this solution is much more simple than the first one. As you can see, using this approach still produces the same result as the first one because it also helps you to remove the null values from the array also. However, if you just want to remove undefined and keep the null objects, you can follow this example:

let array = ['learn',undefined,'share',null,'it'];

// iterate through all elements and check if it is undefined
for (let i = 0 ; i < array.length; i++)
    if (array[i] === undefined) 
       array.splice(i,1);

console.log(array);

Output:

 ['learn', 'share', null, 'it']

We used strict equal comparison (===) to ensure it is equal to undefined in both values and types. As a result, we have removed only undefined objects but kept the others.

Summary

We have learned how to remove undefined values from an array using JavaScript using many different methods. It would help if you considered that each approach has different efficiencies, so you should choose the best way in terms of the size of your arrays.

Maybe you are interested:

Leave a Reply

Your email address will not be published. Required fields are marked *