One of the common operations with an array is removing the item. We will learn about how to remove an item from an array using JavaScript Splice() function.

But before that, let me introduce you to Splice() function in JavaScript.

Splice() Introduction

Splice() is a JavaScript built-in method to play with an array. The splice() function can add or remove an item from an array. Thus changing the original array.

Splice() function Syntax

array.splice(Starting_index, Number_of_elements, List_of_items);

Splice() Parameters

Starting Index

Splice() function will start from here. Keep in mind, an array index start from 0.

Also, if starting_index is greater than the length of the array. Then the splice() function will start from the ending index.

If it is negative, in this case, it will begin that many elements from the end of the array.

For example, with origin -1, meaning -n is the index of the nth last element. Thus it is equal to the index of array.length - n.

Number_of_elements

This is the count of elements in the array to remove from starting_index.

No element removes, if it is 0 or negative. To remove any element, at least you should use any count here.

List_of_items

Here, you can add the list of items in the array. Since, our purpose is to remove the items from the array, we can omit this parameter. This is an optional parameter.This is not required for delete operation.

Splice() Return Value

The splice() function will return an array containing the deleted items.

Below are the examples demonstrating the splice() function in JavaScript.

Removing an item from index 1

var mycars = [BMW, Audi, Austin];
var removed = mycars.splice(1,1);
console.log(removed);  // result [Audi]
console.log(mycars); // original array [BMW, Austin]

Removing 2 items from index 1

var mycars = [BMW,Audi,Austin, Bentley, Bugatti];
var removed = mycars.splice(1,2);
console.log(removed); // result
console.log(mycars); // original array

Remove all items from index 1

var mycars = [BMW,Audi,Austin, Bentley, Bugatti];
var removed = mycars.splice(1);
console.log(removed); // result
console.log(mycars); // original array

Remove and insert an item on index 1 when count is 0 zero

var mycars = [BMW,Audi,Austin, Bentley, Bugatti];
var removed = mycars.splice(1,0,Chevrolet);
console.log(removed); // result
console.log(mycars); // original array
Note that, we passed 0 in count parameter. That means, no item will remove from the array. It will insert new item on the same index position of 1.

Remove and insert an item on index 1 when count is 1 zero

Lets repeat the above example with count 1 in the second parameter of splice() function. As a result, it will remove and then insert an item in the same position. In other words, it is replacing the item.

var mycars = [BMW,Audi,Austin, Bentley, Bugatti];
var removed = mycars.splice(1,1,Chevrolet);
console.log(removed); // result
console.log(mycars); // original array

Reference

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

Further Reading

Add An Item To An Array Using JavaScript Splice()

Understanding Angular Modules and Its Types

Create Your Blog Site With Gatsby.js Static Site Generator