To remove a specific item from an array in JavaScript, there are several common approaches. The best method depends on whether you want to modify the original array or create a new array, and whether you need to remove the first occurrence or all occurrences of the item. Here are the most practical solutions:
1. Using splice()
(Modifies Original Array)
If you know the index of the item, use splice()
to remove it:
javascript
const array = [1, 2, 3, 4, 5];
const index = array.indexOf(3); // Find the index
if (index !== -1) {
array.splice(index, 1); // Remove 1 item at the index
}
console.log(array); // Output: [1, 2, 4, 5]
2. Using filter()
(Creates a New Array)
If you want to preserve the original array and remove all occurrences of a value:
javascript
const array = [1, 2, 3, 4, 3, 5];
const valueToRemove = 3;
const newArray = array.filter(item => item !== valueToRemove);
console.log(newArray); // Output: [1, 2, 4, 5]
3. Remove by Object Reference
For objects (removing by reference, not value):
javascript
const obj = { id: 123 };
const array = [obj, { id: 456 }, { id: 123 }];
array.splice(array.indexOf(obj), 1); // Removes the first occurrence of `obj`
4. Remove All Occurrences
Combine filter()
to remove all instances of a value:
javascript
const array = [1, 2, 3, 4, 3, 5];
const valueToRemove = 3;
const filteredArray = array.filter(item => item !== valueToRemove);
Key Considerations:
- Primitives vs. Objects:
- For primitives (numbers, strings), use
indexOf
or strict equality (===
). - For objects, use
findIndex
with a condition (e.g.,item.id === targetId
).
- For primitives (numbers, strings), use
- Performance:
splice()
is efficient for single removals but mutates the array.filter()
is non-destructive but creates a new array (suitable for large datasets).
- Edge Cases:
- Check if the item exists (
index !== -1
) to avoid errors. - Use
Array.from()
or the spread operator ([...array]
) to clone arrays if needed.
- Check if the item exists (
Complete Example
javascript
// Remove the first occurrence of a value
function removeItem(array, value) {
const index = array.indexOf(value);
if (index !== -1) {
array.splice(index, 1);
}
return array;
}
// Remove all occurrences of a value
function removeAllOccurrences(array, value) {
return array.filter(item => item !== value);
}
Use these methods based on whether you need to modify the original array or work with a new copy.