JSFiddle - React, Tailwind, and code Playground

by Saksham Malhotra

HTML

<div class="container">
  <div class="text"></div><wbr>
</div>

JavaScript

const arr = ["This is a sample", "It can READ", "It can WRITE", "It can Excel"];
let length = arr.length
let startTime = 0;
const typing_speed = 20;
let lastIndex = -1
let currentIndex = 0;

for (let i = 0; i < length; i++) {
  let sentence = arr[i]
  let charCount = sentence.length;

  setInterval(() => {
    let lastString = arr[lastIndex % length] || '';
    let currentString = arr[currentIndex % length];
    let sameTillIndex = findSameTillIndex(lastString, currentString);
  })
}

function findSameTillIndex(lastString, currentString) {
  let index;
  for (index = 0; index < lastString.length; index++) {
    if (lastString[index] !== currentString[index]) {
      break;
    }
    return index;
  }

}

// get current text in dom