Remove an item from an array in JavaScript

There are multiple ways to remove an item from an array in javascript

1. Use filter() method to remove an item by value
2. Use indexOf() and splice() methods together to remove an item by value
3. Use pop() method to remove an item from the end of the array
4. Use shift() method to remove an item from the start of the array
5. Use lodash methods

Use filter() method to remove an item by value

The filter() method creates a new array will all elements that pass the test defined by the given callback function.

let letters = ['a', 'b', 'c', 'd', 'e', 'f'];

let result = letters.filter(letter =>  letter != 'b');

console.log('old array', letters);
// output: old array [ 'a', 'b', 'c', 'd', 'e', 'f' ]

console.log('new array', result);
// output: new array [ 'a', 'c', 'd', 'e', 'f' ]

In the above sample code, we are removing item ‘b’ from the letters array.  The callback functions check letter != ‘b’ and it returns false for the item ‘b’ and true for all other items. So the result array doesn't contain the letter b.

The filter method can also be used to filter out the array of items with multiple condition checks.

Use indexOf() and splice() methods together to remove an item by value

We can remove a specific item from an array using indexOf() and splice() methods together. The indexOf() method returns the index where the value matches the value passed into it. If no items in the array match the given value, then it returns -1. The splice() method is used to remove items from an array with a given index. The second parameter is the number of items that should be removed from the given index. In our case, we are only removing one item. So we were given ‘1’ as the second parameter in the below example.

let letters = ['a', 'b', 'c', 'd', 'e', 'f'];

let index = letters.indexOf('b');
let removedItem = letters.splice(index, 1);

console.log(letters);
// output:[ 'a', 'c', 'd', 'e', 'f' ]

console.log(removedItem);
// output: [ 'b' ]

Use pop() method to remove an item from the end of the array

The last item of the array can be removed using pop() method. The pop method modifies the array on which it was invoked.

let letters = ['a', 'b', 'c', 'd', 'e', 'f'];

let popped = letters.pop()

console.log(letters);
// output: [ 'a', 'b', 'c', 'd', 'e' ]

console.log(popped);
// output: a

In the above example, we removed item ‘f’ from the end of the array letters. The pop() method returns the removed item ‘a’.

Use shift() method to remove an item from the start of the array

The shift() method can be used to remove an item from the start of an array. The shift() method changes the original array and it returns the removed item.

let letters = ['a', 'b', 'c', 'd', 'e', 'f'];

let shifted = letters.shift();

console.log(letters);
// output: [ 'b', 'c', 'd', 'e', 'f' ]

console.log(shifted);
// output: a

In the above example, we removed the first item ‘a’ from the array.

Use lodash methods

Lodash is a javascript library that provides useful functions for manipulating arrays, numbers, objects, strings, etc.

The _.remove() removes all elements from the array that satisfies the condition returns true and returns an array of the removed elements. It is very similar to the filter() method, but the only difference is remove() method mutates the original array, and the filter() method does not mutate.

const _ = require('lodash');
let letters = ['a', 'b', 'c', 'd', 'e', 'f'];

let result = _.remove(letters, function(letter) {
    return letter == 'b';
  });

console.log('old array', letters);
// output: old array [ 'a', 'c', 'd', 'e', 'f' ]

console.log('new array', result);
// output: new array [ 'b' ]

Conclusion

To remove an item from an array in javascript, use filter() method or indexOf() and splice() methods together to remove an item by value. Use pop() method to remove an item from the end of the array and use shift() method to remove an item from the start of the array. Another option is to use lodash javascript library which provides useful functions for manipulating arrays, numbers, objects, strings.