FlowLab Logo

Deque Visualizer

Select an action
 
11
FRONT
22
33
BACK
Logs
No operations yet
Notes
Deque (Double-Ended Queue) supports push/pop/peek at both ends.
Push Front/Back inserts at the front/back, Pop Front/Back removes from the front/back, Peek Front/Back inspects either end.
"Random Op" randomly picks one of push/pop front/back, with animation and limit.
Deque Limit: 6 (simulates overflow)
Animations and diagram visually show deque growth/shrink from both ends.
The UI disables controls while animating for safety.
Peek highlights the element for 3 seconds.
Overflow and underflow events are visually shown.
Implementation (TypeScript)
class Deque<T> {
  private arr: T[] = [];
  pushFront(value: T) { this.arr.unshift(value); }
  pushBack(value: T) { this.arr.push(value); }
  popFront(): T | undefined { return this.arr.shift(); }
  popBack(): T | undefined { return this.arr.pop(); }
  peekFront(): T | undefined { return this.arr[0]; }
  peekBack(): T | undefined { return this.arr[this.arr.length - 1]; }
  clear() { this.arr = []; }
  size() { return this.arr.length; }
}
About Deques
A deque is a double-ended queue that supports fast insertion and removal from both the front and back.
Applications:
  • Sliding window algorithms
  • Undo/redo systems
  • Job/task scheduling
  • Palindrome checking
Main deque operations:
  • pushFront(value): Add at the front.
  • pushBack(value): Add at the back.
  • popFront(): Remove and return from the front.
  • popBack(): Remove and return from the back.
  • peekFront(): Return front without removing.
  • peekBack(): Return back without removing.
  • clear(): Remove all elements.
  • size(): Number of elements.
Deques are often used as the basis for other data structures and can be implemented efficiently using linked lists or dynamic arrays.