Heim  >  Artikel  >  Web-Frontend  >  So verwenden Sie setTimeout in JavaScript

So verwenden Sie setTimeout in JavaScript

不言
不言Original
2018-12-14 17:08:476207Durchsuche

setTimeout kann einen bestimmten Vorgang nach einer bestimmten Zeitspanne ausführen, ohne ihn zu wiederholen. In diesem Artikel werfen wir einen Blick auf die Verwendung des setTimeout-Timers.

So verwenden Sie setTimeout in JavaScript

Wir wissen, dass es in JavaScript zwei Arten von Timing-Prozessoren gibt: setInterval und setTimeout. Im vorherigen Artikel haben wir setInterval Timer vorgestellt Im folgenden Artikel werfen wir einen Blick auf die Verwendung des setTimeout-Timers in JavaScript.

setTimeout() ist eine zu window gehörende Methode, mit der nach einer angegebenen Anzahl von Millisekunden eine Funktion aufgerufen oder ein Ausdruck berechnet wird.

Die grundlegende Syntax ist wie folgt

setTimeout(function函数,固定的时间[,参数1,参数2,参数3,.......])

Sehen wir uns die Verwendung von setTimeout

genauer an

Schauen wir uns zunächst einen einfachen Code an

<!DOCTYPE html>
<html lang = "ja">
  <head>
    <meta charset = "utf-8">
    <title>JavaScript</title>
  </head>
  <body>
    <script>
      var count = 0;
      var countup = function(){
        console.log(count++);
      } 
    </script>
  </body>
</html>

, um die Zählvariable vorzubereiten, basierend auf 0, zu zählen und einzeln zu addieren (count ++) und dann console.log zur Ausgabe zu verwenden. Und fügen Sie diese Verarbeitungsreihe in die Variable countupp ein.

Angenommen, Sie möchten diese Variable countup nach 1000 Millisekunden aufrufen, müssen Sie setTimeout() hinzufügen

Der Code lautet wie folgt

<script>
      var count = 0;
      var countup = function(){
        console.log(count++);
      } 
      setTimeout(countup, 1000);
    </script>

Da setTimeout nur ist Einmal aufgerufen, die Ausgabe 0 und nach 1000 Millisekunden abgeschlossen.

So verwenden Sie setTimeout in JavaScript

Wie verwende ich setTimeout() zum Iterieren und Zählen wie setInterval()?

Wir können setTimeout in die Iterationsfunktion schreiben, also {}, und es mit countup(); aufrufen.

Der Code lautet wie folgt

<script>
  var count = 0;
  var countup = function(){
    console.log(count++);
    setTimeout(countup, 1000);
  } 
  countup();</script>

Auf diese Weise wird derselbe Vorgang erneut für 1000 Millisekunden wiederholt, beginnend mit dem Punkt, an dem die Verarbeitung abgeschlossen wurde.

Der Operationseffekt ist wie folgt: Behandeln Sie ein Verhalten ähnlich wie bei setInterval.

So verwenden Sie setTimeout in JavaScript

Wenn wir mit dem Zählen aufhören wollen, müssen wir clearTimeout verwenden.

Der Code lautet wie folgt

var id = setTimeoutl(countup,1000);

Durch Angabe dieser ID mit clearTimeout können Sie die setTimeout-Verarbeitung jederzeit stoppen (natürlich wird die Verarbeitung gestoppt)

 <script>
  var count = 0;
  var countup = function(){
    console.log(count++);
    var id = setTimeout(countup, 1000);
    if(count > 5){ 
      clearTimeout(id); 
    }
  }
  countup();
</script>

In Das obige Programm: Wenn der Count von setTimeout ausgeführt wird und countup größer als 5 wird (wenn (count> 5)), wird clearTimeout ausgeführt.

Daher kann bis 5 gezählt werden.

So verwenden Sie setTimeout in JavaScript

Schließlich werfen wir einen kurzen Blick auf den Unterschied zwischen der setInterval-Zählung und der Verwendung der setTimeout-Zählung

Verwendung von setInterval für die iterative Verarbeitung In Der Fall: Wiederholen Sie die gleiche Verarbeitung nach einer bestimmten Zeitspanne ab dem Verarbeitungsstartpunkt

Beim Iterieren von setTimeout: Wiederholen Sie die gleiche Verarbeitung nach einer bestimmten Zeitspanne ab dem Verarbeitungsendpunkt

Selbst wenn Sie also die Zeit nach denselben 1000 Millisekunden angeben, ändert sich auch die Zeit, die zum Starten des nächsten Prozesses benötigt wird.

Wenn ein Prozess außerdem länger als das Intervall dauert, ist das Verhalten fehlerhaft. Wenn Sie sicherstellen möchten, dass zwischen Verarbeitung und Verarbeitung ein gewisser Spielraum besteht, können wir setTimeout verwenden.

Das obige ist der detaillierte Inhalt vonSo verwenden Sie setTimeout in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn