Planlægning: setTimeout og setInterval

Vi kan vælge at undlade at køre en funktion lige nu, men i stedet planlægge dens kørsel til et bestemt tidspunkt i fremtiden. Det kaldes planlægning af kald eller “scheduling a call” på engelsk.

Der er to metoder til dette:

setTimeout tillader os at køre en funktion én gang efter et angivet tidsinterval.
setInterval tillader os at køre en funktion gentagne gange, startende efter et tidsinterval, og gentager derefter kontinuerligt med det samme interval.

De er ikke en del af JavaScript specificationen. Men de fleste miljøer har en intern scheduler og leverer disse metoder. De er understøttet af alle browsere og Node.js.

setTimeout

Syntaksen:

let timerId = setTimeout(func|code, [delay], [arg1], [arg2], ...)

Parametre:

func|code: En funktion eller en kodelinje der skal eksekveres. Normalt er det en funktion. Af historiske grunde kan en kodelinje sendes som en streng, men det anbefales ikke.
delay: Første forsinkelse i millisekunder (1000 ms = 1 sekund), standardværdi er 0.
arg1, arg2…: Argumenter til brug i funktionen func.

Denne kode kalder for eksempel sayHi() efter en sekund:

function sayHi() {
  alert('Hej');
}

setTimeout(sayHi, 1000);

Med arugementer kan det se således ud:

function sayHi(phrase, who) {
  alert( phrase + ', ' + who );
}

setTimeout(sayHi, 1000, "Hej", "Karsten"); // Hej, Karsten

Hvis det første argument er en streng, så opretter JavaScript en funktion fra den.

Så vil dette også virke:

setTimeout("alert('Hej')", 1000);

Brugen at strenge er ikke anbefalet, brug arrow-funktioner i stedet, som dette:

setTimeout(() => alert('Hej'), 1000);

Du kunne komme til at tilføje parenteser () efter funktionens navn, som dette:

          // wrong!
setTimeout(sayHi(), 1000);
        

Det virker ikke fordi setTimeout forventer en reference til en funktion. Og her vil sayHi() (med parentes) køre funktionen og resultatet af afviklingen gives til setTimeout. I vores tilfælde er resultatet af sayHi() undefined (funktionen returnerer intet), så intet bliver planlagt til afvikling.

Fortryd med clearTimeout

Et kald til setTimeout returnerer en “timer identifier” timerId som vi kan bruge til at fortryde den planlagte afvikling.

Syntaksen for at fortryde en planlagt afvikling er:

          let timerId = setTimeout(...);
clearTimeout(timerId);
        

I koden nedenfor planlægger vi en funktion og fortryder den med det samme (vi ændrer lidt hurtigt mening). Som resultat sker intet:

let timerId = setTimeout(() => alert("sker ikke"), 1000);
alert(timerId); // timer identifier

clearTimeout(timerId);
alert(timerId); // samme identifier (den bliver ikke til null efter annulering)

Som vi kan se fra alert output, er timer identifikationen et tal (i en browser). I andre miljøer kan det være noget andet. For eksempel returnerer Node.js et timer objekt med yderligere metoder.

Der er ikke nogen universiel specifikation for metoderne, så man skal undersøge det miljø som koden afvikles i.

For browsere er timere beskrevet i sektionen Timers i dokumentet “HTML Living Standard”.

setInterval

Metoden setInterval har samme syntaks som setTimeout:

let timerId = setInterval(func|code, [delay], [arg1], [arg2], ...)

Alle argumenter har samme betydning som med