How to remove items from an array in JavaScript?

I am Amit Shekhar, I have taught and mentored many developers, and their efforts landed them high-paying tech jobs, helped many tech companies in solving their unique problems, and created many open-source libraries being used by top companies. I am passionate about sharing knowledge through open-source, blogs, and videos.

Join my program and get high paying tech job: amitshekhar.me

Before we start, I would like to mention that, I have released a video playlist to help you crack the Android Interview: Check out Android Interview Questions and Answers.

In this blog, we are going to learn how to remove items from an array in JavaScript. As there are many ways to remove the items from an array in JavaScript, depending on the use case, we can decide which one to use.

We can use any method, operator or property from the following to remove items from an array:

splice() method
filter() method
delete operator
pop() method
shift() method
length property

Let's start learning one by one by example.

Remove an item using `splice()` method

In JavaScript, we can use splice() method to remove an item.

const arr = [1, 2, 3, 4, 5]
const removeItem = 4
const index = arr.indexOf(removeItem)
if (index > -1) {
  arr.splice(index, 1)
}
console.log(arr)
// [ 1, 2, 3, 5 ]

In the above example, we do not have duplicate items. Let's take another example with duplicate items.

const arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
const index = arr.indexOf(removeItem)
if (index > -1) {
  arr.splice(index, 1)
}
console.log(arr)
// [ 1, 2, 3, 5, 4 ]

Here, we can see that the duplicate item case is not getting handled. To handle the duplicate item case, we need to iterate over the array.

const arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
for (let i = 0; i < arr.length; i++) {
  if (arr[i] === removeItem) {
    arr.splice(i, 1)
  }
}
console.log(arr)
// [ 1, 2, 3, 5 ]

Now, we can see that the duplicate item case is also getting handled.

It's time to create utility functions that can be used directly.

function removeOneItem(arr, removeItem) {
  const index = arr.indexOf(removeItem)
  if (index > -1) {
    arr.splice(index, 1)
  }
  return arr
}

const arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
console.log(removeOneItem(arr, removeItem))
// [ 1, 2, 3, 5, 4 ]

function removeAllItems(arr, removeItem) {
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] === removeItem) {
      arr.splice(i, 1)
    }
  }
  return arr
}

const arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
console.log(removeAllItems(arr, removeItem))
// [ 1, 2, 3, 5 ]

This way, we can use these utility functions removeOneItem and removeAllItems.

This way, we can use splice() to remove an item. Now, let's move on to the filter() method.

Remove items using `filter()` method

In JavaScript, we can use filter() method to remove an item.

let arr = [1, 2, 3, 4, 5, 4]
const removeItem = 4
arr = arr.filter((item) => item != removeItem)
console.log(arr)
// [ 1, 2, 3, 5 ]

When we use the filter method, the duplicate item case is also getting handled by default.

Next one is delete() operator.

Remove an item using `delete()` operator

In JavaScript, we can use delete() operator to remove an item.

const arr = [1, 2, 3, 4, 5]
const removeAtIndex = 3
delete arr[removeAtIndex]
console.log(arr)
// [1, 2, 3, empty, 5]

It is important to notice that we have an empty item at that removed index.

Remove the last item using `pop()` method

pop() method can be used to remove the last item from an array.

const arr = [1, 2, 3, 4, 5]
arr.pop()
console.log(arr)
// [ 1, 2, 3, 4 ]

This was an example of using pop() method to remove the last item from an array. Similarly, we can use the shift() method to remove the item from the beginning of an array.

Remove the item from the beginning using `shift()` method

shift() method can be used to remove the item from the beginning of an array in JavaScript.

const arr = [1, 2, 3, 4, 5]
arr.shift()
console.log(arr)
// [ 2, 3, 4, 5 ]

This was an example of using shift() method to remove the item from the beginning of an array. Last one is length property.

Remove items from the end using `length` property

In JavaScript, length property can be used to remove the items from the end of an array.

Here, we can provide the length of the array that will be left after the items removal.

const arr = [1, 2, 3, 4, 5]
arr.length = 4
console.log(arr)
// [ 1, 2, 3, 4 ]

const arr = [1, 2, 3, 4, 5]
arr.length = 3
console.log(arr)
// [ 1, 2, 3 ]

So, we understood how to remove items from an array in JavaScript.

Prepare yourself for Android Interview: Android Interview Questions

That's it for now.

Thanks

Amit Shekhar

You can connect with me on:

Read all of my high-quality blogs here.

Remove an item using splice() method

Remove items using filter() method

Remove an item using delete() operator

Remove the last item using pop() method

Remove the item from the beginning using shift() method

Remove items from the end using length property

Tags