Etude des fonctions: setInterval()  et   setTimeout()

Ces 2 fonctions gère une boucle temporelle ou encore un temps d'attente avant d'exécuter un programme, c'est à dire une fonction associée.
Pour comprendre leur fonctionnement et leur différences, nous vous invitons à cliquer sur les boutons ci-après. 

La fonction setInterval()

Pour stopper le fonctionnement enboucle cliquer ici:

exécute une fonction à intervalle régulier, tourne en boucle

var interval_1 = window.setInterval("boucle_1()", 3000); //setInterval: exécute la fonction boucle_1() toutes les 3 secondes

Noter bien que le nom de la fonction est fourni entre guillements, comme une chaine de caractères (as String)
Cette forme d'écriture classique n'admet pas la transmission de paramètres à la fonction appelée!

La fonction setTimeout()

exécute une fonction au laps d'un certain temps, mais ne tourne pas en boucle.

Lorsque le temps d'attente est terminé, exécute la fonction puis ne fait plus rien

var interval_0 = window.setTimeout("boucle_0()", 3000); //setTimeout: exécute la fonction boucle_0() au bout de 3 secondes d'attente

Noter bien que le nom de la fonction est fourni entre guillements, comme une chaine de caractères (as String)
Cette forme d'écriture classique n'admet pas la transmission de paramètres à la fonction appelée!

La fonction clearInterval()

Cette fonction permet de stopper la boucle activée avec setInterval()
Elle nécessite un paramètre (identifiant) qui est fourni en retour par setInterval()

Passage de paramètres à ces deux fonctions

   

 Pour stopper les boucles cliquer ici:

Pour passer des paramètres à une de ces fonctions il faut écrire le code d'appel de manière particulière.

interval = setInterval(function(){boucle(x, usedFunction);},3000); //setInterval       setTimeout

interval = setTimeout(function(){boucle(x, usedFunction);},3000); //setInterval        setTimeout

Ici boucle() est la fonction que nous voulons exécuter après un laps de temps.
boucle(x, usedFunction) reçoit ici deux paramètres optionnels!
Aux fonctions setInterval() ou setTimeout() nous passons en paramètre non pas la fonction boucle(),
mais une déclaration de fonction qui contient la fonction boucle() avec ses paramètres!

Le deuxième paramètre, ici 3000 exprime la durée d'attente, le laps de temps en millisecondes soit 3 secondes.

 

Pour mémoire voici le code complet qui illustre nos propos:

<script>
/* ---------------------------------------
script trouvé sur:
http://www.commentcamarche.net/forum/affich-14970482-javascript-setinterval-passage-de-param
--------------------------------- */
var interval; //définit un identifiant pour la fonction setInterval
var test = "mon test";

function startInterval(x){
        var usedFunction = "setInterval";
        interval = setInterval(function(){boucle(x, usedFunction);},3000); //setInterval       setTimeout
}

function startTimeout(x){
  var usedFunction = "setTimeout";
  interval = setTimeout(function(){boucle(x, usedFunction);},3000); //setInterval      setTimeout
}

function boucle(identifiant, usedFunction){
        n = cnx.isNotDefined("n", 1); //vérifie si n existe, sinon le créer avec n=1; si n existe conserve sa valeur
        alert(n+" - "+usedFunction+": "+identifiant);
        n++; //incrémente n (n=n+1)
}
</script>