How to Remove First and Last Elements from an Array in JavaScript
Arrays are a great way to store data because they can hold multiple values in a single variable.
However, sometimes you want to remove the first or last element of an array for whatever reason.
In this post, we'll learn how you can use built-in functions to remove the first and last elements from an array in JavaScript.
How to remove the first element
Let's start out with an example array of strings:
JAVASCRIPTconst places = ["Paris", "London", "New York", "Tokyo"];
Now, let's say we want the first element from this array. The best way to remove it from this array is to use the shift
method.
This method will remove the first element from the array and return it.
JAVASCRIPTconst places = ["Paris", "London", "New York", "Tokyo"];
const first = places.shift();
console.log(first);
console.log(places);
BASHParis
["London", "New York", "Tokyo"]
Alternatively, you can use the splice
method to remove the first element by passing in 0
as the first argument and 1
as the second argument.
JAVASCRIPTconst places = ["Paris", "London", "New York", "Tokyo"];
const first = places.splice(0, 1);
console.log(first);
console.log(places);
BASH["Paris"]
["London", "New York", "Tokyo"]
Keep in mind that the difference is that the shift
method returns the removed element, while the splice
method returns an array of the removed elements, in this case, just a single element.
How to remove the last element
If you're instead interested in removing an element, you can use the pop
method, which works the same way as shift
but removes the last element.
JAVASCRIPTconst places = ["Paris", "London", "New York", "Tokyo"];
const last = places.pop();
console.log(last);
console.log(places);
BASHTokyo
["Paris", "London", "New York"]
Similar, you can also use the splice
method to remove the last element by passing in the index of the last element as the first argument and 1
as the second argument.
JAVASCRIPTconst places = ["Paris", "London", "New York", "Tokyo"];
const last = places.splice(places.length - 1, 1);
console.log(last);
console.log(places);
BASH["Tokyo"]
["Paris", "London", "New York"]
Like before, the difference is that the pop
method returns the removed element, while the splice
method returns an array of all the removed elements, even if it is just a single element, which is the case here.
Conclusion
In this post, we learned how to remove the first and last elements from an array in JavaScript.
Simply use the methods shift
and pop
to remove the first and last elements from an array.
Thanks for reading this post!
- Getting Started with TypeScript
- How to Install Node on Windows, macOS and Linux
- Managing PHP Dependencies with Composer
- Getting Started with Electron
- How to deploy a PHP app using Docker
- How to deploy a Deno app using Docker
- Using Puppeteer and Jest for End-to-End Testing
- Build a Real-Time Chat App with Node, Express, and Socket.io
- Getting User Location using JavaScript's Geolocation API
- Learn how to build a Slack Bot using Node.js
- Using Push.js to Display Web Browser Notifications
- Setting Up Stylus CSS Preprocessor