How can I remove a specific item from an array?
Find the index
of the array element you want to remove using indexOf
, and then remove that index with splice
.
The splice() method changes the contents of an array by removingexisting elements and/or adding new elements.
const array = [2, 5, 9];console.log(array);const index = array.indexOf(5);if (index > -1) { array.splice(index, 1);}// array = [2, 9]console.log(array);
The second parameter of splice
is the number of elements to remove. Note that splice
modifies the array in place and returns a new array containing the elements that have been removed.
For the reason of completeness, here are functions. The first function removes only a single occurrence (i.e. removing the first match of 5
from [2,5,9,1,5,8,5]
), while the second function removes all occurrences:
function removeItemOnce(arr, value) { var index = arr.indexOf(value); if (index > -1) { arr.splice(index, 1); } return arr;}function removeItemAll(arr, value) { var i = 0; while (i < arr.length) { if (arr[i] === value) { arr.splice(i, 1); } else { ++i; } } return arr;}// Usageconsole.log(removeItemOnce([2,5,9,1,5,8,5], 5))console.log(removeItemAll([2,5,9,1,5,8,5], 5))
In TypeScript, these functions can stay type-safe with a type parameter:
function removeItem<T>(arr: Array<T>, value: T): Array<T> { const index = arr.indexOf(value); if (index > -1) { arr.splice(index, 1); } return arr;}
Edited on 2016 October
- Do it simple, intuitive and explicit (Occam's razor)
- Do it immutable (original array stay unchanged)
- Do it with standard JavaScript functions, if your browser doesn't support them - use polyfill
In this code example I use "array.filter(...)" function to remove unwanted items from an array. This function doesn't change the original array and creates a new one. If your browser doesn't support this function (e.g. Internet Explorer before version 9, or Firefox before version 1.5), consider using the filter polyfill from Mozilla.
Removing item (ECMA-262 Edition 5 code aka oldstyle JavaScript)
var value = 3var arr = [1, 2, 3, 4, 5, 3]arr = arr.filter(function(item) { return item !== value})console.log(arr)// [ 1, 2, 4, 5 ]
Removing item (ECMAScript 6 code)
let value = 3let arr = [1, 2, 3, 4, 5, 3]arr = arr.filter(item => item !== value)console.log(arr)// [ 1, 2, 4, 5 ]
IMPORTANT ECMAScript 6 "() => {}" arrow function syntax is not supported in Internet Explorer at all, Chrome before 45 version, Firefox before 22 version, and Safari before 10 version. To use ECMAScript 6 syntax in old browsers you can use BabelJS.
Removing multiple items (ECMAScript 7 code)
An additional advantage of this method is that you can remove multiple items
let forDeletion = [2, 3, 5]let arr = [1, 2, 3, 4, 5, 3]arr = arr.filter(item => !forDeletion.includes(item))// !!! Read below about array.includes(...) support !!!console.log(arr)// [ 1, 4 ]
IMPORTANT "array.includes(...)" function is not supported in Internet Explorer at all, Chrome before 47 version, Firefox before 43 version, Safari before 9 version, and Edge before 14 version so here is polyfill from Mozilla.
Removing multiple items (in the future, maybe)
If the "This-Binding Syntax" proposal is ever accepted, you'll be able to do this:
// array-lib.jsexport function remove(...forDeletion) { return this.filter(item => !forDeletion.includes(item))}// main.jsimport { remove } from './array-lib.js'let arr = [1, 2, 3, 4, 5, 3]// :: This-Binding Syntax Proposal// using "remove" function as "virtual method"// without extending Array.prototypearr = arr::remove(2, 3, 5)console.log(arr)// [ 1, 4 ]
Reference
I don't know how you are expecting array.remove(int)
to behave. There are three possibilities I can think of that you might want.
To remove an element of an array at an index i
:
array.splice(i, 1);
If you want to remove every element with value number
from the array:
for (var i = array.length - 1; i >= 0; i--) { if (array[i] === number) { array.splice(i, 1); }}
If you just want to make the element at index i
no longer exist, but you don't want the indexes of the other elements to change:
delete array[i];