Get the first and last elements of an array in JavaScript

Get the First and Last Elements of an Array in JavaScript

We will teach you to get the first and last elements of an array in JavaScript using three different methods: reverse(), at() and length. This basic knowledge is very necessary when you work with arrays in Javascript.

Get the first and last elements of an array in JavaScript

Using shift() and pop()

The shift() method works on an array and moves the first element to the end of the array and returns its value. Whereas the pop() method returns the last element in the array and returns its value.

Syntax:

shift()

pop()

You can get the last element of an array by using the pop(), after that, you can get the first element by using the shift(). For instance:

let arr = ["Learn", "Share", "IT"];

// Get the last element of the array
console.log(arr.pop());

// Get the first element of the original array
console.log(arr.shift());

Output:

IT
Learn

Note: These methods will take the elements out of the original array, and hence the array will be changed.

Using at()

The at() method takes a number value (integer) and returns the element at that index in the array if it exists.

Syntax:

at(position)

Parameter:

  • position: The index (position) of the element you want to get in the array

In an array, the position of the first element is at index 0, while the last element’s index is different depending on the array size. However, if you pass -1 into this method, you will receive the last element in the array without knowing exactly its index:

let arr = ["Learn", "Share", "IT"];

// Get the first element of the array
console.log(arr.at(0));

// Get the last element of the original array
console.log(arr.at(-1));

Output: 

Learn
IT

As you can see, this method returns the same result as the first one. However, please remember that the index of the last element is not -1, it is just a shortcut or a special value for this method only.

Using slice()

This method will return a few elements in the array. You can read the syntax and usage of this method here. For example:

let arr = ["Learn", "Share", "IT"];

// Get the first element of the array
console.log(arr.slice(0,1));

// Get the last  element of the original array
console.log(arr.slice(-1));

Output: 

Learn
IT

As you can see, to get the last element in the array using slice() is somehow familiar with the at() method as we have to pass the number -1. 

Using length property

Basically, length is not a function in JavaScript, but a property of an array. Its value represents the total number of the elements in the array. The last element in an array always has an index that is equal to length – 1. So we will find the length of the array and then minus one:

let arr = ["Learn", "Share", "IT"];

// Get the first element of the array
console.log(arr[0]);

// Get the length of the array
let len = arr.length;

// Get the last element of the original array
console.log(arr[len - 1]);

Output: 

Learn
IT

Most programmers are likely to use this solution as it doesn’t need a method. However, you must remember the index of them is 0 for the first element, and array.length – 1 for the last element.

Summary

We have learned to get the first and last elements of an array in JavaScript using two different approaches. We suggest you use the length property (the last solution) as it is very common. Have a nice day!

Maybe you are interested:

Leave a Reply

Your email address will not be published. Required fields are marked *