How to find and remove a specific item from an array in JavaScript?

Published November 18, 2020

To find and then remove an item or element from an array, you need to use the indexOf() array method to first find the element's index in the array and then use the splice() method to remove that item from that index position.

Consider this array of numbers,

// numbers array
const numsArr = [23, 45, 56, 78];

What if we need to remove element 56 from the array?

Well first, let's use the indexOf() array method to first find its index in the array like this,

// numbers array
const numsArr = [23, 45, 56, 78];

// get the element's index position
// if number is not present the method will return -1
const indexToDelete = numsArr.indexOf(56);

Now let's use the splice() array method to remove the element from the array by passing the index of the element as the first argument and the number of elements to delete from that index position as the second argument like this,

// numbers array
const numsArr = [23, 45, 56, 78];

// get the element's index position
// if number is not present the method will return -1
const indexToDelete = numsArr.indexOf(56);

// remove the element from the array
// by passing index position as the first argument to the splice() method
// and the number of elements to delete from that index position as the second argument
// in our case we need to delete only one element from the index position
numsArr.splice(indexToDelete, 1);

console.log(numsArr); // [23, 45, 78]

Yes ✅! We have successfully removed element 56 from the array.

See this example live in JSBin.

Okay. Now we need to do one more thing to make things more secure. For example, What if we pass another element which is not present in the array, Say 100. Here the indexOf() method would return -1 and everything may break at that point 😕.

So let's add a simple check to see whether the indexOf() method returns -1 and if it returns -1 we wouldn't do any operation with the splice() method.

It can be done like this,

// numbers array
const numsArr = [23, 45, 56, 78];

// get the element's index position
// if number is not present the method will return -1
const indexToDelete = numsArr.indexOf(100);

// remove the element from the array
// by passing index position as the first argument to the splice() method
// and the number of elements to delete from the index position as the second argument
// in our case we need to delete only one element from the index position

// Also, check is the indexOf() method returns -1
// if it returns -1 don't do the splice() opeartion
if (indexToDelete > -1) {
  numsArr.splice(indexToDelete, 1);
} else {
  console.log("element not found in the array");
}

console.log(numsArr); // [23, 45, 56, 78]

See this example live in JSBin.

If you want this as a function,

function removeElement(array, element) {
  const indexToDelete = array.indexOf(element);
  if (indexToDelete > -1) {
    array.splice(indexToDelete, 1);
  } else {
    console.log("element not found in the array");
  }
}

Feel free to share if you found this useful 😃.


Share on: Facebook Twitter