Maison >interface Web >js tutoriel >Comment utiliser setTimeout en JavaScript

Comment utiliser setTimeout en JavaScript

不言original: 2018-12-14 17:08:476255parcourir

setTimeout peut effectuer un processus spécifique après une certaine période de temps sans le répéter. Dans cet article, nous verrons comment utiliser le minuteur setTimeout.

Nous savons qu'il existe deux types de processeurs de timing en JavaScript : setInterval et setTimeout Dans l'article précédent, nous avons introduit setInterval Timer, dans le Dans l'article suivant, nous verrons comment utiliser le timer setTimeout en JavaScript.

setTimeout() est une méthode appartenant à window qui est utilisée pour appeler une fonction ou calculer une expression après un nombre spécifié de millisecondes.

La syntaxe de base est la suivante

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

Examinons de plus près l'utilisation de setTimeout

Regardons d'abord un simple morceau de code

<!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>

Préparez la variable count, utilisez 0 comme base, comptez et ajoutez un par un (count ++), puis utilisez la console .log à afficher. Et mettez cette série de traitements dans la variable de countupp.

Supposons que vous souhaitiez appeler cette variable décompte après 1000 millisecondes, vous devez ajouter setTimeout()

Le code est le suivant

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

Depuis setTimeout n'est appelé qu'une seule fois, il génère donc 0 et se termine après 1 000 millisecondes.

Comment utiliser setTimeout en JavaScript

Comment utiliser setTimeout() pour itérer et compter comme setInterval() ?

Nous pouvons écrire setTimeout dans la fonction d'itération, c'est-à-dire {}, et l'appeler avec countup();

Le code est le suivant

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

En faisant cela, il répète le même processus pendant 1 000 millisecondes à partir du moment où il a terminé le traitement.

L'effet de l'opération est le suivant : gérer un comportement similaire à setInterval.

Comment utiliser setTimeout en JavaScript

Si nous voulons arrêter de compter, nous devons utiliser clearTimeout.

Le code est le suivant

var id = setTimeoutl（countup，1000）;

En spécifiant cet identifiant à l'aide de clearTimeout, vous pouvez arrêter le traitement setTimeout à tout moment (évidemment, le traitement est arrêté)

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

Dans ce qui précède Dans le programme, lorsque le compte de setTimeout est exécuté et que le compte devient supérieur à 5 (if (count> 5)), clearTimeout est exécuté.

On peut donc compter jusqu'à 5.

Comment utiliser setTimeout en JavaScript

Enfin, jetons un bref coup d'œil à la différence entre le comptage setInterval et l'utilisation du comptage setTimeout

Utilisation de setInterval pour le traitement itératif Dans le cas de : Répéter le même traitement après une certaine période de temps à partir du point de départ du traitement

Lors de l'itération de setTimeout : Répéter le même traitement après une certaine période de temps à partir du point de fin du traitement

Par conséquent, même si vous spécifiez le temps après les mêmes 1 000 millisecondes, le temps nécessaire au démarrage du processus suivant changera également.

De plus, si un processus prend plus de temps que l'intervalle, le comportement sera défectueux. Si vous souhaitez vous assurer qu'il existe une certaine marge entre le traitement et le traitement, nous pouvons utiliser setTimeout.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

JavaScript if count console

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Comment utiliser setInterval en JavaScriptArticle suivant：Comment utiliser setInterval en JavaScript

Articles Liés

Voir plus