Home » How to Remove a Specific Item From an Array in JavaScript

How to Remove a Specific Item From an Array in JavaScript

Last updated on June 1, 2020 by

Table of Contents
1. Remove Array Item by Using splice()
2. Remove a Specific Item By Index
3. Remove a Specific Item By Value
4. Remove Last Item From Array in JavaScript
5. Remove First Item From Array in JavaScript
6. Remove All Matching Elements From Array in JavaScript

There could be many ways to remove a specific item from an array in JavaScript, but we will demonstrate to you the best of it. Are you ready to do it? Let’s just do it.

01 Remove Array Item by Using splice()

An array splice() is used for two purposes in JavaScript. The first use is to remove array items and the second use is to add array items.

Syntax:

 array.splice(item-index, number-of-item-remove, add-item1, ....., add-itemX)
1.1 Remove a Specific Item By Index

Let’s say you have an array ["Keyboard", "Mouse", "Laptop", "Charger"] and you want to remove the item “Laptop” from the array.

So as per our array, the “Laptop” item has an index 2. So index 2 will be passed as a first parameter and we just want to remove only one item so 1 will be passed as a second parameter. Now let’s see the example.

var devices = ["Keyboard", "Mouse", "Laptop", "Charger"];

devices.splice(2,1); // It will return ["Keyboard", "Mouse", "Charger"]
1.2 Remove a Specific Item By Value

Let’s say you have an array ["Keyboard", "Mouse", "Laptop", "Charger"] and you want to remove the item “Laptop” from the array and you don’t know the index.

So in such a situation, we will first find the index of the “Laptop” item by using indexOf(), and then we will remove it by using the splice(). Let’s just do it.

<script>

var devices = ["Keyboard", "Mouse", "Laptop", "Charger"];

console.log(devices);

// Find an index from Array
var index = devices.indexOf('Laptop'); 

if (index > -1) { // If index found then it index will be > 0 else -1
    devices.splice(index, 1);
}

console.log(devices); // Output: ["Keyboard", "Mouse", "Charger"]

</script>

02 Remove Last Item From Array in JavaScript

The pop() method is used to remove the last element from an array. It will return that deleted element otherwise it will return undefined if the array is empty.

Syntax:

array.pop()

Let’s say you have an array ["Keyboard", "Mouse", "Laptop", "Charger"] and you want to remove the last item “Charger” from the array. Let’s do it.

<script>

var devices = ["Keyboard", "Mouse", "Laptop", "Charger"];

var popped = devices.pop();

console.log(devices); // New array : ['Keyboard', 'Mouse', 'Laptop' ] 

console.log(popped); // Removed Item : 'Charger'

</script>

03 Remove First Item From Array in JavaScript

The shift() method is used to remove the first element from an array. It will return that deleted element otherwise it will return undefined if the array is empty.

Syntax:

array.shift()

Let’s say you have an array ["Keyboard", "Mouse", "Laptop", "Charger"] and you want to remove the first item “Keyboard” from the array. Let’s do it.

<script>

var devices = ["Keyboard", "Mouse", "Laptop", "Charger"];

var popped = devices.shift();

console.log(devices); // New array : [ 'Mouse', 'Laptop', 'Charger' ] 

console.log(popped); // Removed Item : 'Keyboard'

</script>

04 Remove All Matching Elements From Array in JavaScript

Actually, The filter() method is used to create a new array by filtering array based on conditions. That means we can use filter() method to remove all matching elements by adding conditions and create a new array.

It will return a new array as a result.

Syntax:

array.filter(function(CurrentItem, index, array), thisValue)

Let’s say you have an array ["Keyboard", "Mouse", "Laptop", "Charger", "Laptop", "Pendrive"] and you want to remove all the matching items Laptop from the array. Let’s do it.

<script>

var devices = ["Keyboard", "Mouse", "Laptop", "Charger", "Laptop", "Pendrive"];

var popped = devices.filter( function( item ) {
                 if ( item !== 'Laptop' ) { // If NOT Laptup then return true else return false
                 	return true;
                 }
                 return false;
             });

console.log(popped); // New Array : [ 'Keyboard', 'Mouse', 'Charger', 'Pendrive' ] 

</script>

That’s it for now. We hope this article helped you to remove a specific item from an array in JavaScript

Please let us know in the comments if everything worked as expected, your issues, or any questions. If you think this article saved your time & money, please do comment, share, like & subscribe. Thank you in advance 🙂. Keep Smiling! Happy Coding!

 
 

Leave a Comment