JavaScript: Why does setInterval() exist? [on hold]

Question

READ BEFORE A: This question is not about:

• definiton difference between setTimeout() and setInterval()
• what are bad behaviors of setIterval()
• how to rewrite setInterval() to setTimeout()

Recently I was rewriting some code to setTimeout() that was wrongly using setInterval() for cases where it could cause conflicts, if not executed in order... and then I remembered why there even is a setInterval() in the first place?

Is there any GOOD usage, that CAN'T be replaced with setTimeout() (or something else) ? (preventing deep recursion for a lot of calls in a shorter period?, making sure callback gets called for cases where recursion may be forever pending?)

Or is it just a legacy code helper for things where conflicts don't really matter or are not visible that much?

Also MDN says " requestAnimationFrame() The modern version of setInterval(); " - was setInterval() a good idea but badly implemented from the very start and will be deprecated?

EDIT: This question is NOT about setTimeout() vs setInterval()

Answer 1

A good reason for setInterval() to exist is pure design purpose. Pop-up hints that last for a certain period of time, a delay before firing the function to make sure everything's loaded (not a good way), repetitive patterns that are meant to be displayed/fired one after the other, but slowly, thus making an animation of some kind. I personally don't use setTimeouts or setIntervals yet, but they're useful.

I used to code in Roblox, making games and various mechanisms and the wait() function it had is just brilliant. After months with JS, I found out there is no wait() equivalent, so the setTimeout() was the only way to go.

Nonetheless, good function

Answer 2

setTimeout is used to execute a function of a callback after a certain period of time.

setInterval is used to execute a function or callback repeatedly with the specified interval in between calls.

Answer 3

I would say that it's sometimes a bit easier to read the code if you use setInterval for repetitive tasks. Lets consider below example:

setInterval(() => {
  doALotOfStuff();
  doSomthing();
  andSometingAnother();
}, 1000);

const interval = 1000;
function repeatSth() {
  doALotOfStuff();
  doSomthing();
  andSometingAnother();
  setTimeout(repeatSth, interval);
}
setTimeout(repeatSth, interval);

Both code blocks do the same, but setInterval seems to be slightly more readable in this case at the first glance. The difference is not huge, but still (there may be better ways to write it, I know).

Another thing to consider is execution time of synchronous code preceding inner setTimeout . If for example doSomthing() takes sometimes 1ms and sometimes 500ms to execute then it prevents you to execute in more or less similar intervals like using setInterval - which is also not exact 1000ms, but it will get you more accurate results. Here is working codepen (use with browser console). Moving inner setTimeout to the beginning of repeatSth function seems to solve the problem, but usually people tend to put setTimeout at the end.

In general, I would say that using recursive setTimeout may be better for looped http requests (due to different server response time), but for CPU-intensive tasks setInterval still may be worth consider. But it's more a matter of the code style you prefer.

Answer 4

So the only difference between the two is that while setTimeout() execute a block code after a delay,

setInterval() is used to execute the same block of code in intervals say every 5 minutes