Queue Data Structure in JavaScript

Continuing with Data structures using JavaScript. Today, we will create a Queue class using arrays. I previously stated that in JavaScript, arrays has this functionality by default. Nevertheless, they give you methods that are not part of one data structure, which can lead to unnecessary and unwanted confusion and results.

Characteristics of a Queue

If you arrive at the store and there is a line in the front waiting to enter. When a new person arrives, it is positioned at the end of the line. However, when it is time to enter the store, the first person in line, it is the first person to enter the store. The same concepts apply to a Queue which is First-come, first-served. Additionally, the queue must have the following methods:

• Enqueue: add items to the end of the queue.
• dequeue: remove and return the first item of the queue (First In, First Out).
• Peek: Return the first element of the queue without removing it.
• Length: to know how many items are in the queue.

Other methods that are very useful for iterating with the queue are:

• hastItems: return true or false, depending if the queue has items or not.
• isEmpty: return true or false if depending if the queue is empty or not.

Queue Class in JavaScript

Note that the code code used to implement the Queue data structure in JavaScript is very similar that the one we used to create the Stack class:

class Queue {
  //Constructor
  constructor(){
    //Private array for the queue
    this.queue = [];
  }
  //Return the size or length of the queue
  length(){
    return this.queue.length;
  }
  //Same as length()
  size(){
    return this.length();
  }
  //At new item at the end of the queue
  enqueue(item){
    this.queue.push(item);
  }
  //Remove and return the item at the front of the queue
  dequeue(){
    return this.queue.shift();
  }
  //Returns the content of the front item of the queue
  peek(){
    return this.queue[0];
  }
  //Returns if the queue has items or not
  hasItems(){
    return !!this.length();
  }
  //Returns if the queue is empty or not
  isEmpty(){
    return !this.hasItems();
  }
}

Using the Queue Class

Similar to what we did with the Stack class, we can use the Queue class to hide methods from the Array object that are not relevant for a queue. Additionally, it allows access only to the front of the queue which leaves the rest of the items hidden and impossible to access without removing items from the front.

Creating an instance from the Queue Class

let queue = new Queue();

Adding items to the Queue

queue.enqueue("new item");

Iterating over the queue

let queue = new Queue();
 
queue.enqueue("item one");
queue.enqueue("item two");
queue.enqueue("item three");
 
while(queue.hasItems()) {
   console.log(queue.dequeue());
}

Conclusion

It is easy to limit the functionality of an array to make it work as a particular queue or stack data structure. I personally believe that instead of using the array object directly, it is better to constrain it to the methods required by the job instead of leaving every method public that can be misused by other programmers.