How to Work with JavaScript Array Splice Method?

Last Updated on by in JavaScript

JavaScript Array Splice

JavaScript’s array splice method is very handy when it comes to add, remove, or replace items in an array. In this tutorial, I am going to discuss with you the main features of JavaScript’s Array splice() method.

JavaScript Array splice method features

  • The splice() method allow us to add or remove elements from an array.
  • The splice() method modifies the current array and returns a new array.

1. Splice Method’s Parameter Values Explained

Before we move further, let me explain the arguments passed into the splice method.

ArrayName.splice(start, how_many_items_to_remove, item1, item2, ...);

The index number is the required value, it specifies the position of an array from where the array starts changing. If passed negative value, then it will calculate the position from the end of the array.

This parameter decides the total items to be deleted from the array. If this parameter is set to 0 or negative, then no elements will be removed from the array.

item1, item2, ...
This parameter defines the item in an array. This argument is not required.

2. How to Insert an Item in An array using JavaScript’s Array.splice() Method?

Let’s start with a very basic example of by adding an item in a cars array with the JavaScript’s Array splice() method.

// cars Array
var carsArray1 = ['Tesla', 'Toyota', 'BMW'];
var carsArray2 = ['Honda', 'Ford', 'Porsche', 'RR'];

// Add 1 items at the starting of cars array
// Show carsArray1 result in console
// Answer will be [ 'Suzuki', 'Tesla', 'Toyota', 'BMW' ]
carsArray1.splice(0,0, 'Suzuki');

// Add 2 items in cars array at 2nd and 3rd position
// Show carsArray2 result in console
// Answer will be [ 'Honda', 'Ford', 'Suzuki', 'Nissan', 'Porsche', 'RR' ]
carsArray2.splice(2,0, 'Suzuki', 'Nissan')

3. How to Remove an Item in An array using Splice Method?

// cars Array
var carsArray1 = ['Tesla', 'Toyota', 'BMW'];
var carsArray2 = ['Honda', 'Ford', 'Porsche', 'RR'];

// Remove 1 item from index 1 from carsArray1
// Removed item will be ['Toyota'] in carsArray1
// Returned items are [ 'Tesla', 'BMW' ] in carsArray1

// Remove 2 item from index 1 from carsArray2
// Removed items will be ['Ford', 'Porsche'] in carsArray2
// Returned items are [ 'Honda', 'RR' ] in carsArray2

4. How to Replace an Item in An array using JavaScript’s splice() Method?

Finally, let’s get to know how to Replace some elements in an array in javascript with the splice() method.

// cars Array
var cars = ['Tesla', 'Toyota', 'BMW', 'Honda', 'Ford'];

// Lets replace BMW with Wagon
cars.splice(2,1, 'Wagon');

// Check the result in browser's console
// Result will be [ 'Tesla', 'Toyota', 'Wagon', 'Honda', 'Ford' ]


The splice() method is pretty awesome when it comes to Add, Remove or Insert the values in a JavaScript array. Javascript’s splice method works better with sorted arrays.

In this basic tutorial I tried to focus on a few things for deeper knowledge please visit Developer Mozilla Org.

If you like this tutorial you can follow me on at GitHub, Dribble or LinkedIn and don’t forget to share if you liked this article.

Digamber - Author

Hi, I'm Digamber Singh, a New Delhi-based full-stack developer, tech author, and open-source contributor with 10+ years' experience in HTML, CSS, JavaScript, PHP, and WordPress.