JSFiddle - React, Tailwind, and code Playground

by Peyton Hessler

HTML

<input type="textbox" value="3" id='input' />
<input type='button' value='Enqueue' onclick='addToQueue();' />
<br/>
<input type='button' value='Dequeue' onclick='removeFromQueue();' />
<br/>
<div id='output'></div>

JavaScript

function QueueFromStacks() {
   this.array = [];
		
   this.enqueue = function(value) {
      this.array.push(value.toString());
   }
   
   this.dequeue = function() {   		
     this.array.pop();			
   }
   
   this.print = function() {
   		let s = "";
      this.array.forEach((node) => {
      	s += node.toString() + "</br>";
      });      
      return s;
   }
}

var q = new QueueFromStacks();

function addToQueue() {
  var input = document.getElementById('input').value;
  q.enqueue(input);  
  document.getElementById('output').innerHTML = q.print();
}

function removeFromQueue() {
  q.dequeue();  
  document.getElementById('output').innerHTML = q.print();
}