Creating Queues Using JavaScript – DEV Community



Introduction

Throughout conversations about information constructions within the programming world, the time period queue is heard very often. A queue is a linear information construction that follows the first-in-first-out (FIFO) sample, i.e., removing takes place on the entrance, and addition takes place on the finish. Consider it because the checkout level at a grocery retailer. Clients who get to the checkout counter first get attended to first. They will solely be a part of the queue from the again of the road, and after they get attended to, they go away from the entrance of the road.



Linear information constructions

Linear information constructions are sorts of information constructions by which parts are saved sequentially. The weather are organized in such a method that every factor is straight linked to its earlier and subsequent factor. Nevertheless, the primary factor is barely linked to its earlier factor and the final factor is barely linked to the following factor.

Queues comply with this association sample, and we are able to see that by referring to our grocery retailer checkout counter analogy. Every buyer that walks to the checkout counter represents a component. The primary buyer has a hyperlink to the earlier buyer, the final buyer has a hyperlink to the following buyer and each different buyer in-between has a hyperlink to a earlier and subsequent buyer.



Use instances for queues

There are a number of use instances for queues within the programming and actual world. A few of them embrace:

  • A desk printer: If you ship paperwork to the printer, they’re printed in the identical order by which they’re despatched, and that is very helpful if you’re making an attempt to print paperwork that comply with a selected order. The printer makes certain the pages do not get combined up.
  • Including songs to a queue in your music participant: Generally, whereas we’re engaged on a activity, we now have our go-to songs to maintain the momentum going. The queue operate of the music participant makes certain you hearken to your track alternatives simply the best way it’s organized.
  • Customer support wait-lines: In case you go to a financial institution to file a grievance, they make you wait in traces and the following particular person in line will not be referred to as until the problem of the present buyer has been resolved.
  • File sharing / information switch between two processes: When transferring information from one system to a different, the information are obtained on the opposite finish in the identical order they have been despatched, no matter the time it takes for any of them to get accomplished.

Queues will be carried out in any programming language, however our focus is on methods to create them utilizing JavaScript. In JavaScript, it may also be carried out in two methods: arrays and linked lists. For this text, we are going to implement queues utilizing arrays.



Operations in queues

These are some fundamental operations which can be carried out on queues:

  • Enqueue
  • Dequeue
  • Peek
  • Reversing a queue

For the implementation of the above operations, we’d use an ES6 class and have the assorted operations as strategies.



Making a queue with its operations

Step one is to initialize our class with its personal storage (an array the place our queue parts can be saved):

class Queue {
  constructor() {
    this.queue = [];
  }
}
Enter fullscreen mode

Exit fullscreen mode

The code block above represents the creation of a category named Queue. The constructor() methodology is a particular methodology of a category that’s used to create an object occasion of that class. It may be used to initialize any object that might be used throughout the category strategies. The this key phrase serves as an everyday object inside this context. It may be used to initialize any worth.

Subsequent up, we add every queue operation as a technique of the category.



Enqueue

This time period refers to including a brand new factor to the queue. Since we’re implementing our queue with an array, we are able to use the .push() array methodology so as to add new parts to the queue.

class Queue {
  constructor() {
    this.queue = [];
  }

  enqueue(factor) {
    this.queue.push(factor);
  }
}
Enter fullscreen mode

Exit fullscreen mode

The added traces to our code block characterize a technique of sophistication Queue. It handles one operation which provides a brand new merchandise to the array object that’s initialized utilizing the constructor methodology.

The .enqueue() methodology accepts one argument factor after which provides it to this.queue utilizing the .push() array methodology.



Dequeue

This time period refers to eradicating a brand new factor from the queue. Once more, the .shift() array methodology takes care of this for us simply.

class Queue {
  constructor() {
    this.queue = [];
  }

  enqueue(factor) {
    this.queue.push(factor);
  }

  dequeue() {
    return this.queue.shift();
  }
}
Enter fullscreen mode

Exit fullscreen mode

We added a brand new methodology .dequeue(). This methodology deoesn’t settle for any arguments in contrast to the earlier methodology. It returns a component from the entrance of the queue and in addition removes it utilizing the .shift() array methodology.



Peek

We use the peek() methodology to test for the factor on the entrance of the queue, with out eradicating it:

class Queue {
  constructor() {
    this.queue = [];
  }

  enqueue(factor) {
    this.queue.push(factor);
  }

  dequeue() {
    return this.queue.shift();
  }

  peek() {
    return this.queue[0];
  }
}
Enter fullscreen mode

Exit fullscreen mode

The .peek() methodology checks for the worth on the entrance of the queue by accessing the primary index of the queue.



Reversing a Queue

Because the title implies, we’re merely making an attempt to vary the order of the queue from again to entrance. The reverse() methodology is dealt with utilizing a while loop.

class Queue {
  constructor() {
    this.queue = [];
  }

  enqueue(factor) {
    this.queue.push(factor);
    return this.queue;
  }

  dequeue() {
    return this.queue.shift();
  }

  peek() {
    return this.queue[0];
  }

  reverse() {
    // Declare an empty array
    const reversed = []

    // Iterate by the array utilizing some time loop
    whereas (this.queue.size > 0) {
      reversed.push(this.queue.pop());
    }
    // Set queue utilizing the brand new array
    this.queue = reversed;
    return this.queue;
  }
}
Enter fullscreen mode

Exit fullscreen mode



Utilization

To see how our code works, we’re going to check out every methodology of our class.

First, we have to create a brand new occasion of our class, then use that occasion to entry our strategies.

const consequence = new Queue // Creating a brand new occasion of our class

// Including parts
consequence.enqueue(5) // Returns [5]
consequence.enqueue(3) // Returns [5, 3]
consequence.enqueue(4) // Returns [5, 3, 4]
consequence.enqueue(7) // Returns [5, 3, 4, 7]

// Eradicating a component
consequence.dequeue() // Returns [3, 4, 7]

// Checking the primary factor within the queue
consequence.peek() // Returns 3

// Reversing the queue
consequence.reverse() // Returns [7, 4, 3]
Enter fullscreen mode

Exit fullscreen mode



Conclusion

Abstract:

  • We defined the idea of queues (FIFO) and the way they’re utilized in the actual world.
  • We created a category and carried out varied queue operations (enqueue, dequeue, peek, reverse).

That’s it, of us. We’ve efficiently carried out a queue and its fundamental operations utilizing JavaScript.

Add a Comment

Your email address will not be published. Required fields are marked *