In deze tutorial leer je met behulp van voorbeelden over de JavaScript-methode setInterval ().
In JavaScript kan een codeblok in gespecificeerde tijdsintervallen worden uitgevoerd. Deze tijdsintervallen worden timinggebeurtenissen genoemd.
Er zijn twee methoden om code met specifieke intervallen uit te voeren. Zij zijn:
- setInterval ()
- setTimeout ()
In deze tutorial leer je over de setInterval()methode.
JavaScript setInterval ()
De setInterval()methode herhaalt een codeblok bij elke gegeven timinggebeurtenis.
De veelgebruikte syntaxis van JavaScript setInterval is:
setInterval(function, milliseconds);
De parameters zijn:
- functie - een functie die een blok code bevat
- milliseconden - het tijdsinterval tussen de uitvoering van de functie
De setInterval()methode retourneert een intervalID die een positief geheel getal is.
Voorbeeld 1: geef eens per seconde een tekst weer
// program to display a text using setInterval method function greet() ( console.log('Hello world'); ) setInterval(greet, 1000);
Uitvoer
Hallo wereld Hallo wereld Hallo wereld Hallo wereld Hallo wereld….
In het bovenstaande programma setInterval()roept de methode de greet()functie elke 1000 milliseconden ( 1 seconde) aan.
Vandaar dat het programma toont de tekst Hallo wereld eenmaal per 1 seconde.
Opmerking : de setInterval()methode is handig als u een codeblok meerdere keren wilt herhalen. Bijvoorbeeld het tonen van een bericht met een vast interval.
Voorbeeld 2: weergavetijd elke 5 seconden
// program to display time every 5 seconds function showTime() ( // return new date and time let dateTime= new Date(); // return the time let time = dateTime.toLocaleTimeString(); console.log(time) ) let display = setInterval(showTime, 5000);
Uitvoer
"5:15:28 PM" "5:15:33 PM" "5:15:38 PM"….
Het bovenstaande programma geeft de huidige tijd elke 5 seconden weer.
new Date()geeft de huidige datum en tijd. En toLocaleTimeString()retourneert de huidige tijd. Voor meer informatie over datum en tijd, bezoek JavaScript Datum en tijd.
JavaScript clearInterval ()
Zoals je in het bovenstaande voorbeeld hebt gezien, voert het programma een blok code uit op elk gespecificeerd tijdsinterval. Als u deze functieaanroep wilt stoppen, kunt u de clearInterval()methode gebruiken.
De syntaxis van clearInterval()methode is:
clearInterval(intervalID);
Hier intervalIDis de retourwaarde van de setInterval()methode.
Voorbeeld 3: gebruik de methode clearInterval ()
// program to stop the setInterval() method after five times let count = 0; // function creation let interval = setInterval(function()( // increasing the count by 1 count += 1; // when count equals to 5, stop the function if(count === 5)( clearInterval(interval); ) // display the current time let dateTime= new Date(); let time = dateTime.toLocaleTimeString(); console.log(time); ), 2000);
Uitvoer
16:47:41 16:47:43 16:47:45 16:47:47 16:47:49
In het bovenstaande programma wordt de setInterval()methode gebruikt om de huidige tijd elke 2 seconden weer te geven. De clearInterval()methode stopt de functieaanroep na 5 keer.
U kunt ook aanvullende argumenten aan de setInterval()methode doorgeven . De syntaxis is:
setInterval(function, milliseconds, parameter1,… .paramenterN);
Wanneer u extra parameters doorgeven aan de setInterval()methode, deze parameters ( parameter1, parameter2zal, enz.) Worden doorgegeven aan de opgegeven functie .
Bijvoorbeeld,
// program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setInterval setInterval(greet, 1000, 'John', 'Doe');
Uitvoer
Hallo John Doe Hallo John Doe Hallo John Doe….
In het bovenstaande programma twee parameters Johnen Doeworden doorgegeven aan de setInterval()methode. Deze twee parameters zijn de argumenten die worden doorgegeven aan de functie (hier greet()functie) die binnen de setInterval()methode is gedefinieerd .
Opmerking: als u een functie maar één keer hoeft uit te voeren, is het beter om de methode setTimeout () te gebruiken.
