Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.


    Queue Data Structure in JavaScript

    Kyle ShevlinKyle Shevlin

    In this lesson, you will learn how to create a queue in JavaScript. A queue is a first-in, first-out data structure (FIFO). We can only remove items from the queue one at a time, and must remove items in the same sequence as they were placed in the queue.



    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson




    Instructor: To create our queue data structure, we're going to use a factory function that returns our queue as a plain JavaScript object.

    A queue is a collection of items that obeys the principle of first-in/first-out. When we place an item into the queue, we can only get it out after all the other items that have been added before it have been removed.

    Our queue will have several methods and properties -- an add or enqueue method, a remove or dequeue method, a peek method to look at what's next to be removed, a length property, and lastly, an is-empty method.

    In order to store our items, we'll use an array-held enclosure. Let's start with our enqueue method. We want to keep our collection in the correct order, so we always want to add to the array from one side of it and remove items from the other.

    We'll add items to the front of our array for enqueue with the array unshift method. Next, we'll create our dequeue method using array.pop to remove the final item from the array. This ensures we maintain order in our queue and every good queue is orderly.

    Next, we'll create our peek method that will return the item that's next to be removed. Now we'll create our length property. We need to use a getter for this.

    If we just associate queue.length with our length key, we'll get the value zero because that's the value of queue.length when our object is created. Instead, we want to use a getter function that always returns us the current queue's length.

    Lastly, let's create our is-empty method. Now we can try our queue out. A great use for a queue is a plan. A plan is a collection of steps that needs to happen in a particular order, so let's use a queue to make our plan.

    We'll create our queue, and just for good measure, let's test out our is-empty method right away. When we log it out in the terminal, we see that it's true. Our queue is empty. Let's add a few items to our queue. How about "Make an Egghead Lesson," "Help Others Learn," and "Be Happy"?

    Now if we peek into our queue, we should see "Make an Egghead Lesson." Yeah, that works. Now I've made the lesson. You're watching it, so let's dequeue it.

    If we peek again, we should say, "Help Others Learn." Since I'm almost done with the lesson, and I've taught you how to build a queue, I think I've helped you learn. Let's dequeue that as well.

    If we peek one more time, it says, "Be Happy." I think we're all happy that we learned how to make a queue. Let's dequeue that and then verify that our queue is empty.