How to Remove First Element from Array in JavaScript

There are the following methods to remove the first element from an array.

  1. Method 1: Using the array.shift() method
  2. Method 2: Using the array.splice() method

Method 1: Using the array.shift() method

To remove the first element of an array in JavaScript, use array.shift() method. The shift() method changes the length of an array.

The array shift() method returns the removed element of an array. The shift() method shifts everything to the left.

Syntax

array.shift()

Parameters

The shift() method does not take any parameter.

Return Value

The function returns any type*, representing the removed array element. *An array item can be an integer, a string, a boolean, an array, or any other object type allowed in a JavaScript array.

Example

let dark = ['Jonas', 'Martha', 'Mikkel', 'Ulrich', 'Adam', 'Eva']

removedEl = dark.shift();

console.log('Removed Element: ', removedEl);

console.log('Remaining array', dark);

Output

Removed Element: Jonas

Remaining array [ 'Martha', 'Mikkel', 'Ulrich', 'Adam', 'Eva' ]

You can see that our first element is removed, Jonas, and then we printed the remaining array.

The shift() method is faster than the splice() method, which we will see next.

Method 2: Using the array.splice() method

To delete the first array element in JavaScript, use the array.splice() method. The array.splice() method is a sly way of removing, replacing, and adding items in the array. It works similarly to splice() methods in other languages.

Removing the first element of an array means removing an item whose index is 0. Remember that arrays are zero-indexed in JavaScript.

Syntax

array.splice(index, howmany, item1, ....., itemX)

Parameters

The index parameter is required, and it is an integer that specifies at what position to add/remove items.

The howmany parameter is optional, and it is the number of items to be removed.

The item1, …, itemX parameters are optional, and it is the new item(s) to be added to the array.

Return value

The splice() method returns a new array containing the removed items.

Example

let dark = ['Jonas', 'Martha', 'Mikkel', 'Ulrich', 'Adam', 'Eva']

removedEl = dark.splice(0, 1);

console.log('Removed elements array: ', removedEl);

console.log('Remaining array', dark);

Output

Removed elements array: [ 'Jonas' ]

Remaining array [ 'Martha', 'Mikkel', 'Ulrich', 'Adam', 'Eva' ]

You can see that the splice method does not return a single value; instead, it returns an array of removed items. It can be single or multiple elements of an array.

Conclusion

To remove the first element from an array in JavaScript, you can use the built-in array.shift() function. Apart from the shift() function, you can also use the array.splice() method.

You can use different function combinations to remove elements from the first index, a specific position, and the last index.

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.