V tomto výukovém programu se pomocí příkladů dozvíte o metodě JavaScript setInterval ().
V JavaScriptu lze blok kódu provést ve stanovených časových intervalech. Tyto časové intervaly se nazývají časovací události.
Existují dvě metody provádění kódu v určitých intervalech. Oni jsou:
- setInterval ()
- setTimeout ()
V tomto kurzu se dozvíte o této setInterval()metodě.
JavaScript setInterval ()
setInterval()Metoda opakuje blok kódu v každé dané časování událostí.
Běžně používaná syntaxe JavaScript setInterval je:
setInterval(function, milliseconds);
Jeho parametry jsou:
- funkce - funkce obsahující blok kódu
- milisekundy - časový interval mezi provedením funkce
setInterval()Metoda vrátí intervalID což je kladné celé číslo.
Příklad 1: Zobrazení textu jednou za 1 sekundu
// program to display a text using setInterval method function greet() ( console.log('Hello world'); ) setInterval(greet, 1000);
Výstup
Hello world Hello world Hello world Hello world Hello world….
Ve výše uvedeném programu setInterval()metoda volá greet()funkci každých 1000 milisekund ( 1 s ).
Proto program zobrazuje text Hello world jednou za 1 sekundu.
Poznámka : Tato setInterval()metoda je užitečná, pokud chcete opakovat blok kódu několikrát. Například zobrazování zprávy v pevném intervalu.
Příklad 2: Čas zobrazení každých 5 sekund
// 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);
Výstup
„17:15:28“ „17:15:33“ „17:15:38“….
Výše uvedený program zobrazuje aktuální čas jednou za 5 sekund.
new Date()udává aktuální datum a čas. A toLocaleTimeString()vrátí aktuální čas. Chcete-li se dozvědět více o datu a čase, navštivte JavaScript Datum a čas.
JavaScript clearInterval ()
Jak jste viděli ve výše uvedeném příkladu, program provádí blok kódu v každém zadaném časovém intervalu. Pokud chcete zastavit toto volání funkce, můžete použít clearInterval()metodu.
Syntaxe clearInterval()metody je:
clearInterval(intervalID);
Zde intervalIDje návratová hodnota setInterval()metody.
Příklad 3: Použijte metodu 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);
Výstup
16:47:41 16:47:43 16:47:45 16:47:47 16:47:49
Ve výše uvedeném programu se setInterval()metoda používá k zobrazení aktuálního času každé 2 sekundy. clearInterval()Metoda zastaví volání funkce po 5 krát.
Metodě můžete také předat další argumenty setInterval(). Syntaxe je:
setInterval(function, milliseconds, parameter1,… .paramenterN);
Při předání další parametry k setInterval()metodě, tyto parametry ( parameter1, parameter2bude atd) musí být předán do zadaného funkcí .
Například,
// program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setInterval setInterval(greet, 1000, 'John', 'Doe');
Výstup
Dobrý den John Doe Dobrý den John Doe Dobrý den John Doe….
Ve výše uvedeném programu jsou dva parametry Johna Doejsou předány setInterval()metodě. Tyto dva parametry jsou argumenty, které budou předány funkci (zde greet()funkce), která je definována uvnitř setInterval()metody.
Poznámka: Pokud potřebujete provést funkci pouze jednou, je lepší použít metodu setTimeout ().
