JavaScript - how to implement queue
In this short article, we would like to show how to use JavaScript built-in queues.
In JavaScript, the queue data structure is combined with Array
. There are available push
, pop
, shuft
and unshift
methods that we can use as enqueue
and dequeue
methods.
Methods usage in variants:
push(...)
as enqueue andshift()
as dequeue,unshift(...)
as enqueue andpop()
as dequeue.
Check the below examples to know more about how it works.
1. push
/ shift
based queue example
Let's suppose we want to queue and dequeue: A
, B
and C
.
To do it we need to call 3 times push(...)
and later 3 times shift()
.
Simple example:
// ONLINE-RUNNER:browser;
var queue = [ ]; // new Array()
queue.push('A'); // enqueue A
queue.push('B'); // enqueue B
queue.push('C'); // enqueue C
console.log('Queue contains: ' + queue.join(', '));
console.log(queue.shift()); // dequeue A
console.log(queue.shift()); // dequeue B
console.log(queue.shift()); // dequeue C
console.log('Queue contains: ' + queue.join(', '));
2. unshift
/ pop
based queue example
This kind of queue works the same way but keeps items in reversed order - in the first example printing for filled queue returned A, B, C
, so in this example it will be C, B, A
.
To enqueue items we use unshift
method that puts items at beginning of the queue.
To dequeue items we use pop
method that removes items from the end of the queue.
Simple example:
// ONLINE-RUNNER:browser;
var queue = [ ]; // new Array()
queue.unshift('A'); // enqueue A
queue.unshift('B'); // enqueue B
queue.unshift('C'); // enqueue C
console.log('Queue contains: ' + queue.join(', '));
console.log(queue.pop()); // dequeue A
console.log(queue.pop()); // dequeue B
console.log(queue.pop()); // dequeue C
console.log('Queue contains: ' + queue.join(', '));
3. Multiple items per one enqueue operation example
We are able to insert many items during one enqueue operation.
Variant 1 - simple example:
// ONLINE-RUNNER:browser;
var queue = [ ]; // new Array()
queue.push('A', 'B', 'C'); // enqueue A, B and C
console.log('Queue contains: ' + queue.join(', '));
console.log(queue.shift()); // dequeue A
console.log(queue.shift()); // dequeue B
console.log(queue.shift()); // dequeue C
console.log('Queue contains: ' + queue.join(', '));
Variant 2 - simple example:
Hint: be careful to use it becouse it changed enqueue ordering and can lead to mistakes.
// ONLINE-RUNNER:browser;
var queue = [ ]; // new Array()
queue.unshift('A', 'B', 'C'); // enqueue A, B and C
console.log('Queue contains: ' + queue.join(', '));
console.log(queue.pop()); // dequeue A
console.log(queue.pop()); // dequeue B
console.log(queue.pop()); // dequeue C
console.log('Queue contains: ' + queue.join(', '));