The stack is a linear data structure which follows a particular order in which the operations are performed. The order may be LIFO(Last In First Out) or FILO(First In Last Out).
Pop Operation on Stacks: Accessing the content while removing it from the top of the stack, is known as a Pop Operation. In an array implementation of pop() operation, the data element is not actually removed, instead top is decremented to a lower position in the stack to point to the next value. But in linked-list implementation, pop() actually removes data element and deallocates memory space.
Approach: A pop() operation may involve the following steps:
- Check if the stack is empty or not.
- If the stack is empty, produces an error and exit.
- If the stack is not empty, accesses the data element at which top is pointing.
- Delete the element, using array.pop() operation on buffer.
- Return success.
Example 1: This example describes only push operation on stack.
<!DOCTYPE html> <html> <head> <title>Stack Data Structure</title> <meta charset="UTF-8"> <script src= type="text/javascript"></script> <style> body { padding: 0; margin: 0; } canvas { vertical-align: top; } </style> </head> <body> <script> // Define Stack function function Stack(array) { this.array = []; if (array) this.array = array; } // Add Get Buffer property to object // constructor which slices the array Stack.prototype.getBuffer = function() { return this.array.slice(); } // Add isEmpty properties to object // constructor which returns the // length of the array Stack.prototype.isEmpty = function() { return this.array.length == 0; } // Instance of the stack class var stack1 = new Stack(); //Stack { array: [] } // Add Push property to object constructor // which push elements to the array Stack.prototype.push = function(value) { this.array.push(value); } function setup() { // Create Canvas of size display width * 300 createCanvas(displayWidth, 300); } function draw() { // Set background color background("grey"); // Set stroke weight strokeWeight(3); // Set stroke color stroke('black'); line(10, 45, 90, 45); rect(10, 30, 40, 30); noStroke(); text("TOP", 20, 50); // Display stack for(var i = stack1['array'].length-1; i >= 0; i--) { var p = 10; translate(70, 0); strokeWeight(3); stroke('black'); line(10+p, 45, p+80, 45); noStroke(); rect(10+p, 30, 40+p, 30); text(stack1['array'][i], 40, 50); p += 10; } textSize(16); text("Current Top : " + stack1.peek(), 0, 130); textSize(13); } // Peek Function Stack.prototype.peek = function() { return this.array[this.array.length-1]; } // Call to push operation stack1.push(1); stack1.push(2); stack1.push(3); stack1.push(19); stack1.push(11); stack1.push(12); </script> </body> </html> |
Output:
Example 2: This example uses two Pop operations after pushing the element in the stack by calling stack1.pop() function.
<!DOCTYPE html> <html> <head> <title>Stack Data Structure</title> <meta charset="UTF-8"> <script src= type="text/javascript"></script> <style> body { padding: 0; margin: 0; } canvas { vertical-align: top; } </style> </head> <body> <script> // Define Stack function function Stack(array) { this.array = []; if (array) this.array = array; } // Add Get Buffer property to object // constructor which slices the array Stack.prototype.getBuffer = function() { return this.array.slice(); } // Add isEmpty properties to object // constructor which returns the // length of the array Stack.prototype.isEmpty = function() { return this.array.length == 0; } // Instance of the stack class var stack1 = new Stack(); //Stack { array: [] } // Add Push property to object constructor // which push elements to the array Stack.prototype.push = function(value) { this.array.push(value); } function setup() { // Create Canvas of size display width * 300 createCanvas(displayWidth, 300); } function draw() { // Set background color background("grey"); // Set stroke weight strokeWeight(3); // Set stroke color stroke('black'); line(10, 45, 90, 45); rect(10, 30, 40, 30); noStroke(); text("TOP", 20, 50); // Display stack for(var i = stack1['array'].length-1; i >= 0; i--) { var p = 10; translate(70, 0); strokeWeight(3); stroke('black'); line(10+p, 45, p+80, 45); noStroke(); rect(10+p, 30, 40+p, 30); text(stack1['array'][i], 40, 50); p += 10; } textSize(16); text("Current Top : " + stack1.peek(), 0, 130); textSize(13); } // Peek Function Stack.prototype.peek = function() { return this.array[this.array.length-1]; } // Pop operation Stack.prototype.pop = function() { return this.array.pop(); } // Call to push operation stack1.push(1); stack1.push(2); stack1.push(3); stack1.push(19); stack1.push(11); stack1.push(12); // Call to pop operation stack1.pop(); stack1.pop(); </script> </body> </html> |
Output:


… [Trackback]
[…] Find More to that Topic: geeksforgeeks.org/p5-js-pop-operation-in-stack-2/ […]