Enqueue Operation in DSA Javascript

Mental Model

Adding an item to the end of a line so that it waits its turn.

Analogy: Imagine a queue at a ticket counter where new people join at the back of the line.

front -> [ ] -> [ ] -> [ ] -> null
           ↑rear

Dry Run Walkthrough

Input: queue: 1 -> 2 -> 3 -> null, enqueue value 4

Goal: Add the value 4 to the end of the queue

Step 1: Create a new node with value 4

1 -> 2 -> 3 -> null   newNode(4)

Why: We need a new node to add to the queue

Step 2: Set current rear node's next pointer to new node

1 -> 2 -> 3 -> [4] -> null

Why: Link the new node at the end of the queue

Step 3: Update rear pointer to new node

front -> 1 -> 2 -> 3 -> 4 -> null ← rear

Why: Rear must point to the last node for future enqueues

Result:

front -> 1 -> 2 -> 3 -> 4 -> null ← rear

Annotated Code

DSA Javascript

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

class Queue {
  constructor() {
    this.front = null;
    this.rear = null;
  }

  enqueue(value) {
    const newNode = new Node(value);
    if (this.rear === null) {
      this.front = newNode;
      this.rear = newNode;
      return;
    }
    this.rear.next = newNode;
    this.rear = newNode;
  }

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

const queue = new Queue();
queue.enqueue(1);
queue.enqueue(2);
queue.enqueue(3);
queue.enqueue(4);
queue.printQueue();

const newNode = new Node(value);

Create a new node to add

if (this.rear === null) {

Check if queue is empty

this.front = newNode; this.rear = newNode;

Set front and rear to new node when queue is empty

this.rear.next = newNode;

Link new node at the end of the queue

this.rear = newNode;

Update rear pointer to new node

Output

1 -> 2 -> 3 -> 4 -> null

Complexity Analysis

Time: O(1) because we add the new node directly at the rear without traversing

Space: O(1) because we only create one new node for each enqueue

vs Alternative: Compared to adding at the front or traversing the whole queue, this is faster because we keep a rear pointer

Edge Cases

Empty queue

Front and rear both point to the new node

DSA Javascript

if (this.rear === null) {

Single element queue

New node is linked after the single node and rear updates

DSA Javascript

this.rear.next = newNode;

When to Use This Pattern

When you see a problem asking to add items in order and remove from the front, use enqueue operation to add at the rear of a queue.

Common Mistakes

Mistake: Not updating the rear pointer after adding the new node
Fix: Always set rear to the new node after linking it

Mistake: Not handling empty queue case where front and rear are null
Fix: Check if rear is null and set both front and rear to new node

Summary

Adds a new element to the end of the queue.

Use when you want to keep order and add items at the back.

Remember to update the rear pointer to the new last node.

Practice

1. What does the enqueue operation do in a queue data structure?

easy

A. Adds an element to the end of the queue

B. Removes an element from the front of the queue

C. Checks if the queue is empty

D. Returns the size of the queue

Solution

1. Step 1: Understand the queue behavior

   A queue works like a line where new people join at the end.

2. Step 2: Define enqueue operation

   Enqueue means adding a new element at the end of the queue.

3. Final Answer:

   Adds an element to the end of the queue -> Option A

4. Quick Check:

   Enqueue = Add at end [OK]

Hint: Enqueue always adds at the back of the queue [OK]

Common Mistakes:

• Confusing enqueue with dequeue
• Thinking enqueue removes elements
• Mixing enqueue with checking size

2. Which of the following is the correct syntax to add an element 5 to a queue implemented as an array named queue in JavaScript?

easy

A. queue.enqueue(5);

B. queue.add(5);

C. queue.push(5);

D. queue.insert(5);

Solution

1. Step 1: Identify JavaScript array method for adding at end

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

2. Step 2: Match method to enqueue operation

   Enqueue adds to the end, so queue.push(5); is correct syntax.

3. Final Answer:

   queue.push(5); -> Option C

4. Quick Check:

   Array push adds at end [OK]

Hint: Use push() to enqueue in array-based queue [OK]

Common Mistakes:

• Using non-existent methods like add() or insert()
• Confusing enqueue with dequeue methods
• Trying to use enqueue() directly on array

3. What will be the output of the following JavaScript code?

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

medium

A. [10, 20, 30]

B. [30, 20, 10]

C. [10, 30, 20]

D. Error

Solution

1. Step 1: Trace each enqueue operation

   First push adds 10: queue = [10]. Second push adds 20: queue = [10, 20]. Third push adds 30: queue = [10, 20, 30].

2. Step 2: Print the queue array

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

3. Final Answer:

   [10, 20, 30] -> Option A

4. Quick Check:

   push adds at end, so order is [10, 20, 30] [OK]

Hint: push() adds at end, so order stays as inserted [OK]

Common Mistakes:

• Assuming push adds at front
• Confusing output order
• Expecting error due to empty initialization

4. Identify the error in the following enqueue implementation for a queue using an array:

class Queue {
  constructor() {
    this.items = [];
  }
  enqueue(element) {
    this.items.unshift(element);
  }
}

medium

A. enqueue method should remove element, not add

B. Using unshift adds element at the front, not the end

C. Array should be initialized as null, not []

D. Missing return statement in enqueue method

Solution

1. Step 1: Understand unshift behavior

   unshift adds element at the start (front) of the array, not the end.

2. Step 2: Compare with enqueue operation

   Enqueue must add element at the end, so unshift is incorrect here.

3. Final Answer:

   Using unshift adds element at the front, not the end -> Option B

4. Quick Check:

   Enqueue adds at end, unshift adds at front [OK]

Hint: Use push() for enqueue, not unshift() [OK]

Common Mistakes:

• Confusing unshift with push
• Thinking unshift adds at end
• Ignoring method behavior differences

5. You have a queue implemented with an array. You want to enqueue multiple elements [7, 8, 9] at once while preserving their order. Which code snippet correctly enqueues all elements in order?

hard

A. queue.unshift(7, 8, 9);

B. queue.concat([7, 8, 9]);

C. queue.push([7, 8, 9]);

D. [7, 8, 9].forEach(e => queue.push(e));

Solution

1. Step 1: Analyze each option for enqueue behavior

   queue.push([7, 8, 9]); adds the entire array as one element, not individual elements. queue.concat([7, 8, 9]); creates a new array but does not modify queue. [7, 8, 9].forEach(e => queue.push(e)); pushes each element individually, preserving order. queue.unshift(7, 8, 9); adds elements at front, reversing order.

2. Step 2: Choose the method that enqueues elements individually at the end

   Using forEach with push adds each element in order at the end of queue.

3. Final Answer:

   [7, 8, 9].forEach(e => queue.push(e)); -> Option D

4. Quick Check:

   forEach + push enqueues elements in order [OK]

Hint: Use forEach with push to enqueue multiple elements in order [OK]

Common Mistakes:

• Using push with array adds nested array
• Using unshift reverses order
• Forgetting to assign concat result back to queue