JavaScript Array Pop

Summary: in this tutorial, you’ll learn how to use the JavaScript Array pop() method to remove the last element from an array.

Introduction to the JavaScript Array pop() method

The Array.prototype.pop() method removes the last element from an array and returns the removed element. Here’s the syntax of the pop() method:

array.pop()Code language: CSS (css)

The pop() method changes the length property of the array. If the array is empty, the pop() returns undefined.

JavaScript pop() method example

Let’s take some examples of using the pop() method.

1) Using the JavaScript array pop() method to remove the last element of an array

The following example uses the pop() method to remove the last element of the numbers array:

const numbers = [10, 20, 30];
const last = numbers.pop();

console.log(last); // 30
console.log(numbers.length); // 2Code language: JavaScript (javascript)

Output:

30
2

In this example, the pop() method removes the number 30 from the numbers array. Also, it decreases the value of the length property of the numbers array to 2.

The following picture illustrates how the pop() method works:

JavaScript Array Pop

2) Using the JavaScript array pop() method with an empty array

The following example calls the pop() method on an empty array. In this case, the pop() method returns undefined and the length is of the array is zero:

const numbers = [];
const last = numbers.pop();

console.log(last);
console.log(numbers.length);Code language: JavaScript (javascript)

Output:

undefined
0Code language: JavaScript (javascript)

Using JavaScript pop() method with array-like objects

The pop() method is generic. Therefore, you can use the call() or apply() to call the pop() method on the array-like object. Internally, the pop() uses the length property of the array-like object to determine the last element to remove.

See the following example:

let greetings = {
  0: 'Hi',
  1: 'Hello',
  2: 'Howdy',
  length: 2,
  removeLast() {
    return [].pop.call(this);
  },
};

let greting = greetings.removeLast();

console.log(greting);
console.log(greetings);
Code language: JavaScript (javascript)

Output:

'Howdy'

{
  '0': 'Hi',
  '1': 'Hello',
  length: 2,
  removeLast: [Function: removeLast]
}Code language: JavaScript (javascript)

How it works.

First, define the greetings object that has:

  • Four properties 0, 1, 2, and length.
  • One method removeLast() that uses the call() method of an array to invoke the pop() method.

Second, call the removeLast() method of the greetings object:

let greting = greetings.removeLast();Code language: JavaScript (javascript)

Third, output the removed element (greeting) and the greetings object to the console:

console.log(greting);
console.log(greetings);Code language: JavaScript (javascript)

Summary

  • Use the pop() method to remove the last element of an array.
  • Use the call() or apply() to call the pop() method on an array-like object.
Was this tutorial helpful ?