Ebben az oktatóanyagban példák segítségével megismerheti a JavaScript setInterval () metódust.
A JavaScript-ben egy kódblokk meghatározott időközönként végrehajtható. Ezeket az időintervallumokat időzítési eseményeknek nevezzük.
Két módszer létezik a kód meghatározott időközönként történő végrehajtására. Ők:
- setInterval ()
- setTimeout ()
Ebben az oktatóanyagban megismerheti a setInterval()
módszert.
JavaScript setInterval ()
A setInterval()
módszer minden adott időzítési eseménynél megismétel egy kódblokkot.
A JavaScript setInterval általánosan használt szintaxisa:
setInterval(function, milliseconds);
Paraméterei a következők:
- function - kódblokkot tartalmazó függvény
- milliszekundum - a függvény végrehajtása közötti időintervallum
A setInterval()
módszer egy intervalID-t ad vissza, amely pozitív egész szám.
1. példa: Szöveg megjelenítése másodpercenként
// program to display a text using setInterval method function greet() ( console.log('Hello world'); ) setInterval(greet, 1000);
Kimenet
Helló világ Helló világ Helló világ Helló világ Helló világ….
A fenti programban a setInterval()
módszer 1000 milliszekundumonként ( 1 másodpercenként) hívja meg a greet()
függvényt .
Ezért a program 1 másodpercenként megjeleníti a Hello world szöveget .
Megjegyzés : A setInterval()
módszer akkor hasznos, ha egy kódblokkot többször meg akar ismételni. Például egy üzenet megjelenítése meghatározott időközönként.
2. példa: Megjelenítési idő 5 másodpercenként
// 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);
Kimenet
"17:15:28 PM" "17:15:33 PM" "17:15:38 PM"….
A fenti program 5 másodpercenként megjeleníti az aktuális időt .
new Date()
megadja az aktuális dátumot és időt. És toLocaleTimeString()
visszaadja az aktuális időt. Ha többet szeretne megtudni a dátumról és az időről, látogasson el a JavaScript dátum és idő oldalára.
JavaScript clearInterval ()
Amint a fenti példában láthattad, a program minden megadott időintervallumban végrehajt egy kódblokkot. Ha le akarja állítani ezt a függvényhívást, használhatja a clearInterval()
módszert.
A clearInterval()
módszer szintaxisa :
clearInterval(intervalID);
Itt intervalID
a setInterval()
módszer visszatérési értéke .
3. példa: Használja a clearInterval () metódust
// 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);
Kimenet
16:47:41 4:47:43 PM 16:47:45 16:47:47 16:47:49 16:47:49 PM
A fenti programban a setInterval()
módszer az aktuális idő 2 másodpercenként történő megjelenítésére szolgál. A clearInterval()
módszer leállítja a függvényhívás után 5 alkalommal.
További argumentumokat is átadhat a setInterval()
metódusnak. A szintaxis a következő:
setInterval(function, milliseconds, parameter1,… .paramenterN);
Ha át paraméterek a setInterval()
módszer, ezek a paraméterek ( parameter1
, parameter2
stb) kerül átadásra a megadott funkciót .
Például,
// program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setInterval setInterval(greet, 1000, 'John', 'Doe');
Kimenet
Helló John Doe Helló John Doe Helló, John Doe….
A fenti programban két paramétert adunk át John
és Doe
adjuk át a setInterval()
módszernek. Ez a két paraméter azok az argumentumok, greet()
amelyeket a setInterval()
metódusban definiált függvénynek (itt, függvény) továbbítunk .
Megjegyzés: Ha egy funkciót csak egyszer kell végrehajtania, akkor jobb a setTimeout () metódust használni.