Push Operation on Stack in DSA Javascript

Mental Model

A stack is like a pile where you add new items only on top. Pushing means putting a new item on the top of this pile.

Analogy: Imagine a stack of plates. When you add a new plate, you always put it on the top of the stack.

Top -> null
Stack: null

Dry Run Walkthrough

Input: stack: empty, push value 5

Goal: Add the value 5 on top of the empty stack

Step 1: Create a new node with value 5

Top -> [5] -> null

Why: We need a new node to hold the pushed value

Step 2: Set new node's next pointer to current top (which is null)

Top -> [5] -> null

Why: Link new node to the previous top (empty in this case)

Step 3: Update top pointer to new node

Top -> [5] -> null

Why: Top must point to the newly pushed node

Result:

Top -> 5 -> null

Annotated Code

DSA Javascript

class Node {
  constructor(value) {
    this.value = value;
    this.next = null;
  }
}

class Stack {
  constructor() {
    this.top = null;
  }

  push(value) {
    const newNode = new Node(value); // create new node
    newNode.next = this.top; // link new node to current top
    this.top = newNode; // update top to new node
  }

  printStack() {
    let curr = this.top;
    let result = '';
    while (curr) {
      result += curr.value + ' -> ';
      curr = curr.next;
    }
    result += 'null';
    console.log(result);
  }
}

// Driver code
const stack = new Stack();
stack.push(5);
stack.printStack();

const newNode = new Node(value); // create new node

create a new node to hold the pushed value

newNode.next = this.top; // link new node to current top

link new node's next to current top to keep stack order

this.top = newNode; // update top to new node

update top pointer to new node to reflect new stack top

Output

5 -> null

Complexity Analysis

Time: O(1) because push adds one node at the top without traversal

Space: O(1) because only one new node is created per push

vs Alternative: Compared to arrays where push might require resizing, linked list push is always O(1)

Edge Cases

pushing onto an empty stack

top pointer updates from null to new node correctly

DSA Javascript

newNode.next = this.top; // link new node to current top

When to Use This Pattern

When you see a problem needing last-in-first-out order, reach for stack push operation because it adds elements on top efficiently.

Common Mistakes

Mistake: Not linking the new node's next to the current top before updating top
Fix: Always set newNode.next = this.top before updating this.top = newNode

Summary

Adds a new element on top of the stack.

Use when you need to add items in last-in-first-out order quickly.

Remember to link the new node to the old top before moving the top pointer.

Practice

1. What does the push operation do in a stack data structure?

easy

A. Checks if the stack is empty

B. Removes the top element from the stack

C. Returns the bottom element of the stack

D. Adds an element to the top of the stack

Solution

1. Step 1: Understand stack operations

   A stack follows Last In First Out (LIFO). The push operation adds an element on top.

2. Step 2: Identify the role of push

   It inserts a new element at the top, increasing stack size by one.

3. Final Answer:

   Adds an element to the top of the stack -> Option D

4. Quick Check:

   Push = Add top element [OK]

Hint: Push means add on top of stack [OK]

Common Mistakes:

• Confusing push with pop operation
• Thinking push removes elements
• Mixing stack with queue operations

2. Which of the following is the correct syntax to push an element 5 into a stack array named stack in JavaScript?

easy

A. stack.add(5);

B. stack.push(5);

C. push.stack(5);

D. stack.insert(5);

Solution

1. Step 1: Recall JavaScript array push syntax

   JavaScript arrays use push() method to add elements at the end.

2. Step 2: Match correct method call

   stack.push(5); correctly calls push on the array named stack.

3. Final Answer:

   stack.push(5); -> Option B

4. Quick Check:

   Array push method = stack.push(value) [OK]

Hint: Use arrayName.push(value) to add element [OK]

Common Mistakes:

• Using non-existent methods like add or insert
• Reversing method and object like push.stack()
• Forgetting parentheses after push

3. What will be the output after executing the following code?

const stack = [];
stack.push(10);
stack.push(20);
stack.push(30);
console.log(stack);

medium

A. [10, 20]

B. [30, 20, 10]

C. [10, 20, 30]

D. Error: push is not a function

Solution

1. Step 1: Trace push operations on empty stack

   Initially stack is empty []. After push(10), stack = [10]. After push(20), stack = [10, 20]. After push(30), stack = [10, 20, 30].

2. Step 2: Understand console.log output

   Logging stack prints the array as is: [10, 20, 30].

3. Final Answer:

   [10, 20, 30] -> Option C

4. Quick Check:

   Push adds at end, so stack = [10,20,30] [OK]

Hint: Push adds at end, array grows left to right [OK]

Common Mistakes:

• Assuming push adds at start (top as front)
• Confusing stack order with queue
• Expecting reversed array output

4. Identify the error in the following code snippet that tries to push an element into a stack:

let stack = 5;
stack.push(10);

medium

A. stack is not an array, so push method is undefined

B. push method requires two arguments

C. stack.push should be stack.add

D. No error, code runs fine

Solution

1. Step 1: Check variable type of stack

   stack is assigned number 5, not an array. Numbers do not have push method.

2. Step 2: Understand push method applicability

   push is an array method. Calling push on a number causes error: push is not a function.

3. Final Answer:

   stack is not an array, so push method is undefined -> Option A

4. Quick Check:

   push only works on arrays [OK]

Hint: Only arrays have push method [OK]

Common Mistakes:

• Assuming push works on numbers
• Thinking push needs multiple arguments
• Confusing push with add method

5. Given a stack implemented as an array, how would you push multiple elements [1, 2, 3] onto it so that 3 is on top after all pushes?
Choose the correct code snippet.

hard

A. stack.push(1); stack.push(2); stack.push(3);

B. stack.push(3); stack.push(2); stack.push(1);

C. stack.push([1, 2, 3]);

D. stack = [1, 2, 3];

Solution

1. Step 1: Understand push order for stack

   Push adds elements on top. To have 3 on top, push 1 first, then 2, then 3.

2. Step 2: Analyze options

   Sequential pushes of 1 then 2 then 3 add elements individually with 3 on top. Pushing [1,2,3] adds a single array element with [1,2,3] on top. Reverse pushes put 1 on top. Assignment replaces the stack entirely.

3. Final Answer:

   stack.push(1); stack.push(2); stack.push(3); -> Option A

4. Quick Check:

   Push in order to have last element on top [OK]

Hint: Push elements in order, last pushed is top [OK]

Common Mistakes:

• Pushing array [1,2,3] as single element
• Pushing in reverse order
• Replacing stack instead of pushing