Javascript setInterval ()

In diesem Tutorial lernen Sie anhand von Beispielen die JavaScript-Methode setInterval () kennen.

In JavaScript kann ein Codeblock in bestimmten Zeitintervallen ausgeführt werden. Diese Zeitintervalle werden als Timing-Ereignisse bezeichnet.

Es gibt zwei Methoden zum Ausführen von Code in bestimmten Intervallen. Sie sind:

  • setInterval ()
  • setTimeout ()

In diesem Tutorial lernen Sie die setInterval()Methode kennen.

JavaScript setInterval ()

Die setInterval()Methode wiederholt bei jedem gegebenen Timing-Ereignis einen Codeblock.

Die häufig verwendete Syntax von JavaScript setInterval lautet:

 setInterval(function, milliseconds);

Seine Parameter sind:

  • Funktion - Eine Funktion, die einen Codeblock enthält
  • Millisekunden - das Zeitintervall zwischen der Ausführung der Funktion

Die setInterval()Methode gibt eine Intervall- ID zurück, die eine positive Ganzzahl ist.

Beispiel 1: Alle 1 Sekunde einen Text anzeigen

 // program to display a text using setInterval method function greet() ( console.log('Hello world'); ) setInterval(greet, 1000);

Ausgabe

 Hallo Welt Hallo Welt Hallo Welt Hallo Welt Hallo Welt….

Im obigen Programm setInterval()ruft die Methode die greet()Funktion alle 1000 Millisekunden ( 1 Sekunde) auf.

Daher zeigt das Programm alle 1 Sekunde den Text Hallo Welt an .

Hinweis : Die setInterval()Methode ist nützlich, wenn Sie einen Codeblock mehrmals wiederholen möchten. Beispiel: Anzeigen einer Nachricht in einem festen Intervall.

Beispiel 2: Anzeigezeit alle 5 Sekunden

 // 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);

Ausgabe

 "5:15:28 PM" "5:15:33 PM" "5:15:38 PM"….

Das obige Programm zeigt die aktuelle Zeit alle 5 Sekunden an.

new Date()gibt das aktuelle Datum und die aktuelle Uhrzeit an. Und toLocaleTimeString()gibt die aktuelle Zeit zurück. Weitere Informationen zu Datum und Uhrzeit finden Sie unter Datum und Uhrzeit von JavaScript.

JavaScript clearInterval ()

Wie Sie im obigen Beispiel gesehen haben, führt das Programm in jedem angegebenen Zeitintervall einen Codeblock aus. Wenn Sie diesen Funktionsaufruf beenden möchten, können Sie die clearInterval()Methode verwenden.

Die Syntax der clearInterval()Methode lautet:

 clearInterval(intervalID);

Hier intervalIDist der Rückgabewert der setInterval()Methode.

Beispiel 3: Verwenden Sie die 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);

Ausgabe

 16:47:41 4:47:43 4:47:45 16:47:47 4:47:49

Im obigen Programm wird die setInterval()Methode verwendet, um die aktuelle Zeit alle 2 Sekunden anzuzeigen . Die clearInterval()Methode stoppt den Funktionsaufruf nach 5 Mal.

Sie können der setInterval()Methode auch zusätzliche Argumente übergeben . Die Syntax lautet:

 setInterval(function, milliseconds, parameter1,… .paramenterN);

Wenn Sie zusätzliche Parameter an die Pass - setInterval()Methode, diese Parameter ( parameter1, parameter2usw.) an die angegebenen weitergegeben Funktion .

Beispielsweise,

 // program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setInterval setInterval(greet, 1000, 'John', 'Doe');

Ausgabe

 Hallo John Doe Hallo John Doe Hallo John Doe….

Im obigen Programm werden zwei Parameter Johnund Doean die setInterval()Methode übergeben. Diese beiden Parameter sind die Argumente, die an die Funktion (hier greet()Funktion) übergeben werden, die in der setInterval()Methode definiert ist .

Hinweis: Wenn Sie eine Funktion nur einmal ausführen müssen, ist es besser, die Methode setTimeout () zu verwenden.

Interessante Beiträge...