How to create a queue in TypeScript using an array?


We will learn to create a queue from scratch using the array in TypeScript in this tutorial.

The Queue is a data structure allowing users to add elements from the end and remove them from the start. It means it works based on the FIFO concept, meaning first in, first out.

Also, we can’t remove the element randomly from the queue like an array. We can only remove elements from the first index and add them to the last empty index.

Here, we will use some concepts of object-oriented programming language to create a queue using an array.

Methods of Queue

Users can learn about the methods we will implement in our Queue class below.

  • enQueue() − The enQueue() method adds an element to the queue.

  • deQueue() − It removes the element from the queue.

  • Size () − It returns the length of the queue, representing the total number of elements in the queue.

  • isFull() − It returns true if the queue is full; Otherwise false.

  • isEmpty() − It returns true if the queue doesn’t contain any elements; Otherwise, it is false.

  • printeQueue() − It prints all the elements of the queue.

Implement the queue using class and array

Users can follow the steps below to create a queue using class and array and implement the above methods.

Step 1 − First, we need to create an interface for the queue class to prepare a structure for the queue class.

interface queueInterface<Type> {
   enQueue(dataItem: Type): void;
   deQueue(): Type | undefined;
   isEmpty(): boolean;
   isFull(): boolean;
   size(): number;
   printQueue(): void;
   // other methods, if users wanted to add new methods for the Queue
}

We have used the interface keyword in the above syntax to create an interface. The interface contains the structure of enQueue, deQueue, isEmpty(), isFUll(), etc. methods.

Step 2 − Now, create a class named QueueClass implementing the queueInterface.

class QueueClass<Type> implements queueInterface<Type> {
   // implement queue methods and variables
}

Step 3 − We need to implement all methods for the queue declared in the queueInterface.

Step 4 − Implement the isEmpty() method and isFull() method to check if the queue is empty or full.

isEmpty(): boolean {
   return this.QueueData.length <= 0;
    
}
isFull(): boolean {
   return this.QueueData.length >= this.maxSize;
}

In the above code, we used the array's length property to check if the queue is full or empty.

Step 5 − Implement the enQueue() method.

enQueue(dataItem: Type): void {
   if (this.isFull()) {
      // queue is full
   } else {
      // Queue has some space
      this.QueueData.push(dataItem);
   }
}

In the above code, we are using the isFull() method to check first if the queue has some space or not. After that, we used the push() method of the array to push elements in the Queue.

Step 6 − Implement the deQueue() method.

deQueue(): Type | undefined {
   if (this.isEmpty()) {
      // Queue contains zero elements
      return;
   } else {
      // Queue has more than zero elements
      return this.QueueData.shift();
   }
}

In the above code, we are checking whether the queue is empty and using the array's shift() method to remove an element from the first index.

Step 7 − Implement the size() and printQueue() methods.

size(): number {
   return this.QueueData.length;
}
printQueue(): void {
   for (let i = 0; i < this.QueueData.length; i++) {
      console.log(this.QueueData[i]);
   }
}
}

We have used the array's length property to get the Queue's size. In the printQueue() method, we use the for-loop to print all queue data.

Example

The example below contains the implementation of QueueClass. We have implemented all the above methods in the QueueClass.

The QueueClass contains the constructor that initializes the queue class's maximum size. We have created the object of the QueueClass and used different methods of QueueClass to perform various operations on Queue.

interface queueInterface<Type> {
   enQueue(dataItem: Type): void;
   deQueue(): Type | undefined;
   isEmpty(): boolean;
   isFull(): boolean;
   size(): number;
   printQueue(): void;
}

class QueueClass<Type> implements queueInterface<Type> {
   private QueueData: Array<Type> = [];
   private maxSize: number = 0;

   constructor(length: number) {
      this.maxSize = length;
   }
   isEmpty(): boolean {
      let result = this.QueueData.length <= 0;
      return result;
   }
   isFull(): boolean {
      let result = this.QueueData.length >= this.maxSize;
      return result;
   }
   enQueue(dataItem: Type): void {
      if (this.isFull()) {
         console.log("The queue is full!");
      } else {
         this.QueueData.push(dataItem);
      }
   }

   deQueue(): Type | undefined {
      if (this.isEmpty()) {
         console.log("The Queue is empty! There is no element to pop-out");
         return;
      } else {
         var element = this.QueueData.shift();
         return element;
      }
   }

   size(): number {
      let len = this.QueueData.length;
      return len;
   }
   printQueue(): void {
      for (let i = 0; i < this.QueueData.length; i++) {
         console.log(this.QueueData[i]);
      }
   }
}

const testQueue = new QueueClass<string>(3);
testQueue.enQueue("JavaScript");
testQueue.enQueue("typeScript");
testQueue.enQueue("TutorialsPoint");

console.log("Is Queue full? " + testQueue.isFull());
console.log("The last remove element from the queue is " + testQueue.deQueue());
console.log("The size of the Queue is " + testQueue.size());
console.log("Is Queue empty? " + testQueue.isEmpty());
testQueue.printQueue();

On compiling, it will generate the following JavaScript code −

var QueueClass = /** @class */ (function () {
   function QueueClass(length) {
      this.QueueData = [];
      this.maxSize = 0;
      this.maxSize = length;
   }
   QueueClass.prototype.isEmpty = function () {
      var result = this.QueueData.length <= 0;
      return result;
   };
   QueueClass.prototype.isFull = function () {
      var result = this.QueueData.length >= this.maxSize;
      return result;
   };
   QueueClass.prototype.enQueue = function (dataItem) {
      if (this.isFull()) {
         console.log("The queue is full!");
      }
      else {
         this.QueueData.push(dataItem);
      }
   };
   QueueClass.prototype.deQueue = function () {
      if (this.isEmpty()) {
         console.log("The Queue is empty! There is no element to pop-out");
         return;
      }
      else {
         var element = this.QueueData.shift();
         return element;
      }
   };
   QueueClass.prototype.size = function () {
      var len = this.QueueData.length;
      return len;
   };
   QueueClass.prototype.printQueue = function () {
      for (var i = 0; i < this.QueueData.length; i++) {
         console.log(this.QueueData[i]);
      }
   };
   return QueueClass;
}());
var testQueue = new QueueClass(3);
testQueue.enQueue("JavaScript");
testQueue.enQueue("typeScript");
testQueue.enQueue("TutorialsPoint");
console.log("Is Queue full? " + testQueue.isFull());
console.log("The last remove element from the queue is " + testQueue.deQueue());
console.log("The size of the Queue is " + testQueue.size());
console.log("Is Queue empty? " + testQueue.isEmpty());
testQueue.printQueue();

Output

The above code will produce the following output −

Is Queue full? true
The last remove element from the queue is JavaScript
The size of the Queue is 2
Is Queue empty? falsetypeScript
TutorialsPoint

In the above output, users can observe that the deQueue() method removes the element we first added to the queue.

We learned to create Queue from scratch in TypeScript. Users can use the different methods of Queue and can also implement other methods for QueueClass according to requirements.

Updated on: 20-Jan-2023

1K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements