JSFiddle - React, Tailwind, and code Playground

by MimiE

HTML

<h3>Assignment 8: "Sorting"</h3>

    Enter value.<br>
    <input type="text" id="input"><br>
    <input type="button" value="Random List" id="output1">
    <input type="button" value="Merge Sort" id="output2">
    <input type="button" value="Bubble Sort" id="output3">
    <input type="button" value="Add String" id="output4">
   
      <div id="randomList"></div>
    
      <div id="mergeSorted"></div>
    
      <div id="bubbleSorted"></div>

JavaScript

var list = new List();
function List() {
  this.head = null;
  this.length = 0;
}

function Node(_val) {
  this.value = _val;
  this.next = null;
}
List.prototype.push = function(_val) {
  var node = new Node(_val);
  let currentNode = this.head;

  if (!currentNode) {
    this.head = node;
    this.length++;

    return node;
  }
  while (currentNode.next) {
    currentNode = currentNode.next;
  }
  currentNode.next = node;
  this.length++;
  return node;

}
List.prototype.pop = function() {
  var length = this.length;

  if (this.head == null) {
    return null;
  }
  var itemToPop = this.head;
  this.head = this.head.next;
  this.length--;
  return itemToPop.value;
}
var list = new List();
function mergeSort(_list) {
  var length = _list.length;
  if (length < 2) return _list;
  var left = new List();
  var right = new List();
  var i = 0;
  var node = _list.head;
  while (node != null) {
    if (i < length / 2) {
      left.push(node.value);
    } else {
      right.push(node.value);
    }
    i++;
    node = node.next;
  }
  return merge(mergeSort(left), mergeSort(right));
}

function merge(left, right) {
  var result = new List();
  while ((left.head != null) && (right.head != null)) {
    if (left.head.value <= right.head.value) {
      result.push(left.pop());
    } else {
      result.push(right.pop());
    }
  }
  while (left.head != null) {
    result.push(left.pop());
  }
  while (right.head != null) {
    result.push(right.pop())
  }
  return result;
}
//Bubble Sort function
function bubbleSort(_list) {

  var i = _list.head
  var j = i.next;
  console.log("i is: " + i.value);
  console.log("j is: " + j.value);
  for (i = _list.head; i != null; i = i.next) {
    for (j = i.next; j != null; j = j.next) {
      if (i.value > j.value) {
        let temp = i.value;
        i.value = j.value;
        j.value = temp;
      }
    }
  }
  return _list;
}

document.getElementById("output1").onclick = function() {
  
  for (var num = 1; num <= 8; num++) {
   ...