JavaScript

Add Element to Array at Specific Index in JavaScript

While working with JavaScript arrays, sometimes, it is necessary to add an item at a particular index. In JavaScript, multiple methods exist to add an element at the start or the end of the array, but it is a bit difficult in the middle of an array. There is no way in the Array object to add an element to a certain index; hence the built-in “splice()” method can be utilized.

This tutorial will explain the way to add an element in an array at a certain index using JavaScript.

How to Add an Element at a Particular Index in JavaScript Array?

The direct insertion of a new element into an array at any given index is not supported by any built-in method. To do so, use the “splice()” method, which modifies an array’s contents by eliminating, adding, or replacing new items at any specified index. It also updates the array that invokes it rather than creating a new one.

Syntax

Use the given syntax for the splice() method:

array.splice(index, no_of_EliminatedItems, item1, ... itemN)

In the above syntax:

  • The “index” is where the new element will be positioned.
  • The “no_of_EliminatedItems” is the number of elements that must be removed from the array. It is an optional argument.
  • The “item1, … itemN” are the elements that will be added to an array.

Return Value

The splice() method returns an updated array with new elements at the specific index.

Example 1: Add an Element to an Array at a Specific Index Using the splice() Method

Create an array “number”:

var number = [0, 1, 2, 8, 9];

Call the “splice()” method by passing index “3” as the first argument which is the starting index of the elements that will be added in an array, “0” as a second argument, which indicates no element will be deleted from the array, and then “3, 4, 5” are the elements that need to be added in an array:

number.splice(3, 0, 3, 4, 5);

Print the updated array on the console using the “console.log()” method:

console.log(number);

Output

The output indicates that the elements are successfully added to an array from index 3.

Example 2: Add an Array to an Array at a Specific Index Using the splice() Method

Create an array “num” and add all of its elements in the “number” array:

var num = [3, 4, 5, 6, 7];

Use the spread operator () in the splice() method as a third argument that will copy all the elements of the “num” array into the “number” array:

number.splice(3, 0, ...num);

Print the resultant array on the console:

console.log(number);

Output

The above output shows that all elements of an array “num” are successfully added in the “number” array at the 3rd index.

Conclusion

The JavaScript “splice()” is used to add the element at a specified index which modifies the array by eliminating, adding, or replacing elements from an array. This tutorial explained the procedure for adding an element in an array at a specific index using JavaScript.

About the author

Farah Batool

I completed my master's degree in computer science. I am an academic researcher and love to learn and write about new technologies. I am passionate about writing and sharing my experience with the world.