How to Remove Multiple Elements from Array in JavaScript?
Here are various methods to remove multiple elements from an array in JavaScript
1. Using filter() Method
The filter() method creates a new array with the elements that pass the condition. This method does not change the original array.
let a = [1, 2, 3, 4, 5];
let remove = [2, 4];
a = a.filter(x => !remove.includes(x));
console.log(a);
In this example
- remove contains elements to be removed.
- filter() iterates over a and includes elements not in remove.
- includes() checks if an element is in the remove array.
2. Using splice() in a Loop
The splice() method can be used to Iterate through the array and remove elements using splice().
let a = [1, 2, 3, 4, 5];
let remove = [2, 4];
for (let i = a.length - 1; i >= 0; i--) {
if (remove.includes(a[i])) {
a.splice(i, 1);
}
}
console.log(a);
In this example
- Loop backward to avoid index shifting.
- splice(i, 1) removes the element at index i.
- includes() checks if the element is in Remove.
3. Using Set for Faster Lookups
Set is Used to convert the elements to be removed into a Set for better performance.
let a = [1, 2, 3, 4, 5];
let remove = new Set([2, 4]);
a = a.filter(x => !remove.has(x));
console.log(a);
In this example
- Set allows O(1) lookup time compared to O(n) for arrays.
- has() checks if the element exists in Remove.
4. Using reduce() Method
The reduce() method can be used to build a new array while excluding elements based on the specified indexes.
let a = [1, 2, 3, 4, 5];
let remove = [2, 4];
a = a.reduce((acc, x) => {
if (!remove.includes(x)) acc.push(x);
return acc;
}, []);
console.log(a);
In this example
- Accumulates elements not in Remove into a new array.
- includes() checks membership in Remove.
5. Using forEach()
A forEach() loop through the array and selectively add elements to a new array.
let a = [1, 2, 3, 4, 5];
let remove = [2, 4];
let res = [];
a.forEach(x => {
if (!remove.includes(x)) res.push(x);
});
console.log(res);
Output
[ 1, 3, 5 ]
In this example
- forEach() iterates over a.
- Elements not in Remove are pushed to res.
6. Using concat() and filter()
The concat() and filter() is concatenate filtered elements directly into a new array.
let a = [1, 2, 3, 4, 5];
let remove = [2, 4];
let res = [].concat(a.filter(x => !remove.includes(x)));
console.log(res);
In this example
- filter() removes unwanted elements.
- concat() ensures result is a new array (optional for immutability).
7. Using splice() with Index Lookup
Find indices of elements to remove, then use splice().
let a = [1, 2, 3, 4, 5];
let remove = [2, 4];
remove.forEach(x => {
let index = a.indexOf(x);
if (index !== -1) a.splice(index, 1);
});
console.log(a);
Output
[ 1, 3, 5 ]
In this example
- indexOf() finds the index of an element.
- splice() removes the element by index.
8. Using Lodash’s difference()
Utilize Lodash’s utility function to exclude unwanted elements from the array.
let _ = require('lodash');
let a = [1, 2, 3, 4, 5];
let remove = [2, 4];
a = _.diff(a, remove);
console.log(a);
In this example
- difference() returns elements in a not in Remove.
- Convenient for large arrays.
Which Approach You Should Use
Approach | When to Use | Best For |
|---|---|---|
filter() | When you need to create a new array. | Readability and general use cases. |
splice() | When mutating the original array is acceptable | In-place modifications. |
reduce() | When combining filtering with other transformations. | Building arrays with complex logic. |
for loop | For simplicity or when avoiding higher-order methods. | Simple control of logic. |
Using Set | For large datasets or frequent operations. | Performance when removing many elements. |
flatMap() | When combining filtering with transformations or chaining operations. | When combining filtering with transformations or chaining operations. |
