pop()
ES3+Removes the last element from an array and returns that element.
Syntax
array.pop()Return Value
The removed element, or undefined if empty
Examples
const fruits = ['apple', 'banana', 'cherry'];
const last = fruits.pop();
console.log(last);
console.log(fruits);📌 When to Use
Use pop() when you need to remove and retrieve the last element from an array. It's essential for implementing stacks (LIFO), processing items in reverse order, or when you need to consume elements from the end.
⚠️ Common Mistakes
Forgetting that pop() modifies the original array - it's a mutating operation
Not checking if the array is empty - pop() returns undefined on empty arrays
Using pop() when you only need to read the last element - use arr[arr.length - 1] or arr.at(-1)
✅ Best Practices
For immutable operations, use slice: const newArr = arr.slice(0, -1)
Use arr.at(-1) to read the last element without removing it (ES2022)
Use push/pop together to implement a stack data structure
⚡ Performance Notes
pop() is O(1) - extremely fast as it only removes the last element without shifting other elements. For stack operations (LIFO), always prefer push/pop over shift/unshift for better performance.
🌍 Real World Example
Implementing Browser History Navigation
Use a stack to implement back navigation in a single-page application
const history = [];
function navigate(url) {
history.push(url);
renderPage(url);
}
function goBack() {
if (history.length > 1) {
history.pop(); // Remove current page
const previousUrl = history[history.length - 1];
renderPage(previousUrl);
return true;
}
return false; // Can't go back further
}
navigate('/home');
navigate('/products');
navigate('/cart');
goBack(); // Returns to /products