How to Delete a value from an Array in JavaScript

There are many cases when we have to remove some unused values from the Array which no longer needed within the program.



In this tutorial, I show you some ways to remove the item from the Array.

1. pop() – Remove last value

This method remove and returns the removing value from the last.

Syntax –

array-name.pop();

Example 

var names_arr = ["Yogesh","Sonarika","Vishal","Anil"];
console.log('Return : ' + names_arr.pop() );

for(var key in names_arr){
 console.log("index : " + key + " , name : " + names_arr[key]);
}

Output

Return: Anil
index : 0 , name : Yogesh
index : 1 , name : Sonarika
index : 2 , name : Vishal

2. shift() – Remove first value

It also returns the removing value as pop() but it removes from the first instead of last. After delete, it adjusts the indexes.

Syntax –

array-name.shift();

Example 

var names_arr = ["Yogesh","Sonarika","Vishal","Anil"];
console.log('Return : ' + names_arr.shift() );

for(var key in names_arr){
 console.log("index : " + key + " , name : " + names_arr[key]);
}
Output

Return : Yogesh
index : 0 , name : Sonarika
index : 1 , name : Vishal
index : 2 , name : Anil

3. delete – Remove value on the index

This method removes the value of the index but doesn’t delete the index that means the Array length doesn’t affect.

It returns true when it’s successfully executed.

Syntax – 

delete array-name[ index ];

Example

var num_arr = [ 54, 23, 42, 12 ];
console.log( 'Return : ' + delete num_arr[ 2 ]  );
for(var key in num_arr){
 console.log('index : ' + key + ' , num : ' + num_arr[key]);
}

Output

Return : true
index : 0 , num : 54
index : 1 , num : 23
index : 3 , num : 12

4. splice()

It removes, replaces, and append value in the Array. It returns the value of the removing index and a new Array after modification.

Syntax –

array-name.splice(removing index, number of values [, value1,value2,... ]);
This method takes 3 parameters –

The first parameter is the index of the removing item.
The number of items is being removed. For example – you have specified 2 in this case this removes the index value and the next one also.
It is an optional parameter from here you can set new values.
Delete all other values after given index
For this only specify the index from there you want to delete all after it.

var names_arr = ["Yogesh","Sonarika","Vishal","Anil"];
var index = names_arr.indexOf('Vishal');
console.log("Remove : " + names_arr.splice(index) );

for(var key in names_arr){
 console.log("index : " + key + " , name : " + names_arr[key]);
}

Output

Remove : Vishal, Anil
index : 0 , name : Yogesh
index : 1 , name : Sonarika

Delete particular Index
Specify the second parameter for only deleting the single value or multiple values.

var names_arr = ["Yogesh","Sonarika","Vishal","Anil"];
var index = names_arr.indexOf('Vishal');
console.log("Remove : " + names_arr.splice(index, 1) );

for(var key in names_arr){
 console.log("index : " + key + " , name : " + names_arr[key]);
}

Output

Remove : Vishal
index : 0 , name : Yogesh
index : 1 , name : Sonarika
index : 2 , name : Anil

Replace the value
For replacing the value at the given index I am specifying the third parameter.

var names_arr = ["Yogesh","Sonarika","Vishal","Anil"];
var index = names_arr.indexOf('Vishal');
console.log("Remove : " + names_arr.splice(index, 1, "Mayank") );

for(var key in names_arr){
 console.log("index : " + key + " , name : " + names_arr[key]);
}

Output

Remove : Vishal
index : 0 , name : Yogesh
index : 1 , name : Sonarika
index : 2 , name : Mayank
index : 3 , name : Anil

5. Conclusion

I showed some of the ways by using this you can remove values from the Array.

They are useful according to cases, If you don’t want to remove the index and only want to remove value then you can use delete for this. Because of this, you can reuse the index by initializing new value.