Interview answer drill

Use this JavaScript interview question to rehearse a quick answer, common mistake, follow-up, and production pitfall.

Stack vs Queue in JavaScript (Differences + Implementation)Frontend interview answer

MediumEasyJavascript
Interview focus

This JavaScript interview question tests whether you can explain Stack vs queue in JavaScript: what is the difference, connect it to production trade-offs, and handle common follow-up questions.

  • Stack vs queue in JavaScript: what is the difference explanation without falling back to memorized docs wording
  • Algorithms and Arrays reasoning, edge cases, and production failure modes
  • How you would answer the most likely JavaScript interview follow-up
Practice more JavaScript interview questions
Interview quick answer

Choose a stack when the newest item should leave first and a queue when work must stay FIFO. Strong JavaScript answers surface the Array.shift() O(n) trap early and compare naive queues with head-index or two-stack implementations.

Full interview answer

The Core Idea

Choose by removal order first, then by implementation cost. A stack removes the newest item first (LIFO) and maps cleanly to push()/pop(). A queue removes the oldest item first (FIFO), but in JavaScript a naive queue often uses shift(), which can be O(n) because the array is re-indexed.

First implementation decision

If the most recent item should come out first, use stack semantics. If work must leave in submission order, use queue semantics. After that, decide whether a tiny demo can live with plain array methods or whether a real queue needs a head index or two-stack design to keep dequeue cheap.

Implementation trap
A queue written as items.push(v) plus items.shift() is easy to explain, but it is usually the wrong default once the queue grows or runs in a hot path.

JAVASCRIPT
// Stack (LIFO)
function Stack() { this.items = []; }
Stack.prototype.push = function (v) { this.items.push(v); };
Stack.prototype.pop = function () { return this.items.pop(); };
Stack.prototype.peek = function () { return this.items[this.items.length - 1]; };

// Queue (FIFO) with head index (O(1) dequeue)
function Queue() { this.items = []; this.head = 0; }
Queue.prototype.enqueue = function (v) { this.items.push(v); };
Queue.prototype.dequeue = function () {
  if (this.head >= this.items.length) return undefined;
  const v = this.items[this.head++];
  if (this.head > 50 && this.head * 2 > this.items.length) {
    this.items = this.items.slice(this.head);
    this.head = 0;
  }
  return v;
};
Queue.prototype.peek = function () { return this.items[this.head]; };
                  
JAVASCRIPT
// Queue with two stacks (amortized O(1))
function Queue2() { this.in = []; this.out = []; }
Queue2.prototype.enqueue = function (v) { this.in.push(v); };
Queue2.prototype.dequeue = function () {
  if (this.out.length === 0) {
    while (this.in.length) this.out.push(this.in.pop());
  }
  return this.out.pop();
};
                  

When to use which

  • Stack: call stack, undo/redo, backtracking, recursive traversal.
  • Queue: job processing, BFS, notification delivery, event buffering.
  • Same data, different removal policy: the bug is often in the order choice, not the container name.

Pitfalls and real-world choice

  • Array.shift() is O(n) because it re-indexes the remaining items.
  • If you use a head index, compact occasionally so old slots do not accumulate forever.
  • Do not mix stack and queue semantics in one API just because both can use an array.

    If your bug is about order, ask which item must leave first. Once the order is correct, then choose the cheapest implementation that preserves that rule.
Summary
  • Stack = LIFO and usually fits plain push()/pop().
  • Queue = FIFO, but a naive push()/shift() queue can make dequeue O(n).
  • For real queues, prefer a head index or two-stack implementation when throughput matters.
  • Choose the structure by removal order first, then by implementation cost.
Similar questions
Guides
Preparing for interviews?

Use this as one explanation rep, then continue with the JavaScript interview questions cluster or a guided prep path.