Asynchronous JavaScript: Timeouts and intervals

MDN Learn
#1

Hello. This is me again with strange clarification of the steps of the tutorial.

setInterval():

This is where setInterval() comes in. This works in a very similar way to setTimeout() , except that the function you pass as the first parameter is executed repeatedly at no less than the number of milliseconds given by the second parameter apart, rather than once. You can also pass any parameters required by the function being executed as subsequent parameters of the setInterval() call.

Recursive timeouts:

let i = 1;

setInterval(function run() {
  console.log(i);
  i++
}, 100);
  • The example using setInterval() does things somewhat differently. The interval you chose includes the time taken to execute the code you want to run in. Let’s say that the code takes 40 milliseconds to run — the interval then ends up being only 60 milliseconds.

The first quote says that the interval is always no less than that specified by the second parameter of setInterval().
The second quote indicates that it is possible that the interval will be less than the second specified parameter of setInterval().

Can someone explain this point, please?

#2

Hello @Ti_awer

the interval here mean the waiting interval will be 60 sec

so in other word recursive setTimeout() will wait 100 as in the example

Recursive setTimeout() guarantees the same delay between the executions. (For example, 100ms in the above case.) The code will run, then wait 100 milliseconds before it runs again—so the interval will be the same, regardless of how long the code takes to run.

but setInterval() the time you set will include the time of execution of your code

hope that help and have a nice day :slight_smile:

#3

setTimeout () starts counting after all (?) code has been executed (the web page is fully loaded), and setInterval () at the moment when it just started (regardless of whether the web page is fully loaded or not), right?

Thank you again!

#4

recursive setTimeout start after the other part of the recursive function finish for example

function recursive{
do 1
do 2
do 3
setTimeout();
recursive;
}

setTimeout will start after do 1 and 2 and 3 finish then will wait for whatever time you set

do not check the syntax of the code i right it just to explain the idea

for setInterval will give do that
let us assume the function depend on external resource so some time the function will take 3 sec and other time will take 5 sec and assume we set the interval to be 7 sec so in first case the ideal time of the waiting time whatever yu call it in the first case will be 4 sec but in the second case will be 2 sec

so you got it about right just it not related to the whole page it depend on which part of the page that we used the settimeout and setinterval

of course it could be the would page

hope i explain it in much better way and sorry for late replay and have a nice day :slight_smile:

1 Like