JavaScript Array Pop() Method with Example

JavaScript provides a stack method named pop() to make an array behave like data structure.

The pop() method removes (or delete) the last element of an array and returns the element that it removed.

This method changes the length of the original array. Therefore, it decrements the array’s length property by 1.

Every time the pop() method is called on an array, it shortens the array by one element.

Consider an example below:

 let cities = ["Dhanbad", "New York", "Paris", "Mumbai"]; // Create an array.
// Delete or remove the last element.
  let removedCity = cities.pop(); // pops and returns "Mumbai".
  document.write(cities); // Dhanbad, New York, Paris, Mumbai.
  document.write(removedCity); // Mumbai.

As you can observe in the output, the JavaScript pop() method modifies the original array. Therefore, it is also called mutator method.

JavaScript Array pop() Method Syntax


The general syntax to use the pop() method of array object is as:

array.pop();

In the above syntax, array is the name of array. The pop() method does not take any parameter.

It returns the element that is deleted or popped from an array when the pop() method is invoked with array being the array name. If the array is empty, then the pop() returns undefined.


Note: The Array.pop() method modifies the original array and its length. If you want to remove the first element of an array, then use the JavaScript Array shift() method.

Removing Last Element of an Array in JavaScript


Let’s create a JavaScript program to remove or delete the last item of an array and display the removed element and array length after removing.

Program code 1:

<script>
 let languages = ["JavaScript", "Python", "Java", "C++", "C"];
 let language = languages.pop(); // removing the last element.

 document.write("Removed element: " +language, "<br>"); // getting the last element.
 document.write("Modified array: " +languages, "<br>");
 document.write("Length of array: " +languages.length);
</script>
Output:
      Removed element: C
      Modified array: JavaScript,Python,Java,C++
      Length of array: 4

In this example, we have created an array named languages and called the pop() method on the array. The pop() method has deleted the last element of the array languages and returned the last item, which is string.

We have stored the returned element in the variable language. Then, we have displayed the removed element and array length after removing on the browser.

Popping Last Element of Array like Objects


Let’s create a JavaScript program in which we will create an array-like object containing four elements. Then, we will remove its last element and decrements the length parameter.

Program code 2:

<script>
var numerals = [
     [10, 20, 30],
     [40, 50, 60],
     [70, 80, 90]
 ];
var popped = numerals.pop();
document.write("Removed object: " +popped, "<br>");
document.write("Modified array: " +numerals);
</script>
Output:
     Removed object: 70,80,90
     Modified array: 10,20,30,40,50,60

Browser Support


ECMAScript arrays provide a powerful pop() method to allow stack link behaviour. It provides a feature to pop the last item from an array. All modern browsers such as Chrome, IE Edge, Opera, Firefox, etc. full support ES1 (JavaScript 1997).


In this tutorial, we have discussed array pop() method in JavaScript with many example programs. Hope that you will have understood the basic concept of pop() method and practiced all programs.
Thanks for reading!!!
Next ⇒ JavaScript array push() method⇐ Prev Next ⇒