is there a way to set an interval while a `loop` is being processed

November 28, 2021

I just wonder is there a way to set a interval or run another function while a loop is being processed.

For example:

let result = document.getElementById('result')
let time = document.getElementById('time')
function start(){
  setInterval(function(){
    time.textContent = parseFloat(time.textContent)+1
  },1000)
  setTimeout(reallystart(),0)
}
function reallystart(){
for(let i =0;i<10000;i++){
  result.innerHTML +=i
}
}

 

<button onclick='start()'>Click</button>
  <div id='result'></div>
  <div id='time'>0</div>

In the example, the interval will only be processed after the loop is done, but is there a way that I could make the interval run while the loop is being processed.

Thanks for any responds!

>Solution :

JavaScript is single threaded, So you can only execute a single operation at a time. You can achieve concurrency in JavaScript using Event loop

You can also execute operations using Web workers which run in parallel with main thread, but web workers can’t access UI elements. it can only communicate with main thread using messages