Premiers pas en JavaScript
boucle WHILE
cuy copyleft
  See You Why?  

 


Le While dans les boucles (20.1) | | Exercices WHILE (20.8)

Contenu

 

 

I. le WHILE dans les boucles

voir <<< séquence précédente

 

 

II. Break et continue dans les boucles

Lorsqu'on dispose d'une liste, il n'est pas rare de devoir répéter des actions sauf dans certains cas, tout en sohaitant continuer le bouclages pour les cas suivants. Cest l'utilité du 'continue' dans la boucle.

Inversément, à l'intérieur d'un bouclage qui peut s'avérer long, il est possible de mettre fin au bouclage avant d'atteindre la condition exprimée. Le 'break' vous permettra une sortie prématurée d'une boucle.

A. le BREAK

Nous venons de le signaler, l'instruction 'break' termine l'exécution de la boucle en cours et reprend le programme à l'instruction qui suit la fin de boucle, marquée par une accolade fermante '}'. Ce 'break' ne nous est d'ailleurs pas inconnu, nous l'avons déjà rencontré lors de notre découverte de l'instruction 'switch'. Un exemple pour éclairer nos propos concernant cette interruption de boucle :

<script type="text/javascript">
    var x = 1;
    document.write("Entrée dans la boucle<br /> ");
    while (x < 20) {
        if (x == 5){
            break; // Interrompt complètement la boucle
        }
        x = x + 1;
        document.write( x + "<br />");
    }
    document.write("Sortie de boucle !<br /> ");
</script>

La boucle initiale devrait écrire 2, 3, 4, 5... jusque 20.
Et oui, la valeur de départ de x est bien 1, mais cette valeur est incrémentée avant de l'écrire... la première valeur écrite est bien 2.
Et oui encore, x ne peut avoir la valeur 20 en entrant... mais l'incrémentation est faite dans la boucle alors que la condition de bouclage était vérifiée. Si x vaut 19, on re-boucle et on incrémente x de 1 puis on l'écrit... au bouclage suivant x vaut 20, donc la condition n'est pas requise pour boucler.

Cet exemple illustre bien l'importance de l'ordre d'écriture des instructions. Si la ligne de code document.write avait été placée en première place dans la boucle, 1 aurait été écrit, mais pas 20... seulement 19...

Mais, une condition dans le parcours, si x vaut 5, on n'incrémente pas et on n'écrit donc pas 6... si on garde l'ordre des instructions tel que celui affiché, mais si position du code document.write en première ligne de la boucle, comme la condition suivrait l'écriture de x, la valeur 5 aurait aussi été écrite ;
simples, ces interruptions de boucles, non ?

Le quasi même exemple d'interruption de boucle FOR :

<script type="text/javascript">
    document.write("Entrée dans la boucle<br /> ");
    for (x=1; x< 20; x++) {
        if (x == 5){
            break; // Interrompt complètement la boucle
        }
        document.write( x + "<br />");
    }
    document.write("Sortie de boucle !<br /> ");
</script>

Idem, sauf que 1 aurait été écrit, mais pas 20 ; et après avoir écrit 4, la boucle incrémente à 5 et la rupture est faite avant d'écrire la valeur 5. À l'opposé, en plaçant le code document.write en début de boucle, la rupture aurait été faite après l'écriture du 5.
À vous de faire attention et d'essayer.

Exemple

<html>
<body>

<h1>break</h1>

<script type="text/javascript">

    document.write("Entrée dans la boucle<br /> ");
    for (x=1; x< 20; x++) {
        if (x == 5){
            break; // Interrompt complètement la boucle
        }
        document.write( x + "<br />");
    }
    document.write("Sortie de boucle !<br /> ");

</script>

</body>
</html>


 

B. le CONTINUE

Bien des tutoriels créés par des non didacticiens prétenderaient que 'continue', c'est presque comme 'break', sauf qu'au lieu de s'arrêter, la boucle se poursuit.
L'idée y est certes, mais quelle imprécision dans l'énoncé.
L'instruction 'continue' interrompt la poursuite ou l'exécution de la boucle en cours, mais reprend l'exécution de la boucle en son début. Le sens de continue n'est donc pas de poursuivre la boucle en cours, mais de s'interrompre et passer à une nouvelle itération de la boucle.

Une bonne illustration vaut mieux qu'un long discours :

<script type="text/javascript">
    var x = 1;
    document.write("Entrée dans la boucle<br /> ");
    while (x < 11) {
        if ((x == 5)!!(x==9)) {
            continue; // Interrompt la boucle en cours mais poursuit une nouvelle itération
        }
        x = x + 1;
        document.write( x + "<br />");
    }
    document.write("Sortie de boucle !<br /> ");
</script>

L'instruction 'continue' risque de générer des boucles infinies si les conditions sont mal placées, car recommencer au début de la ligne, sans avoir incrémenté risque de vous faire tourner en rond...

N'affichera pas 6 ni 10. Mais affichera de 2 à 5, puis de 7 à 9 et enfin 11. Vous en doutez ? Essayez !

Exemple

<html>
<body>

<h1>break</h1>

<script type="text/javascript">
    document.write("Entrée dans la boucle<br /> ");
    for (x=1; x< 20; x++) {
        if ((x == 5)!!(x==9)){
          continue;//Interrompt la boucle en cours mais poursuit une nouvelle itération
        }
        document.write( x + "<br />");
    }
    document.write("Sortie de boucle !<br /> ");
</script>

</body>
</html>


 

C. Controles des boucles par étiquettes

Depuis plusieurs générations de JS, le contrôles des boucles peut se faire grâce à l'emploi d'étiquettes. Une étiquette n'est rien d'autre qu'un identifiant. Syntaxiquement, un deux-points doit suivre le nom d'un identifiant (mieux, d'une étiquette). Une étiquette peut être attribuée à une simple instruction ou à un bloc d'instructions.

Un conseil judicieux : ne placez rien entre l'étiquette et la boucle associée (sauf un éventuel commentaire.

Un break employé sans étiquette interrompt toujours la boucle en cours... et en cas de boucles imbriquées, la boucle la plus intérieure (celle qui est la plus active). Employé avec des étiquettes, le break peut interrompre n'importe quelle boucle (de la plus interne à la plus externe). Encore ici, un bon exemple vaut mieux qu'un long discours :

primo: for (i = 0 ; i<10 ; i++) {
   trace( " first : " + i + " : " + j + " : " + k) ;
   secundo: for (j = 0 ; j<10 ; j++) {
      trace( " second : " + i + " : " + j + " : " + k) ;
   
   tertio: for (k = 0 ; k<10 ; k++) {
         trace( " third : " + i + " : " + j + " : " + k) ;
         if (k == 1) continue secondo ;
         if ((k==3)||(k==4)
) break secundo;
      }
   }
}
 

Et toutes les variantes à tester ici:

Exemple

<html>
<body>

<h1>étiquette</h1>

<script type="text/javascript"><script type="text/javascript">
   i=0;j=0;k=0;
   primo:
   for (i = 0 ; i<5 ; i++) {
      document.write( "<br> first : " + i + " : " + j + " : " + k) ;
      secundo:
      for (j = 0 ; j<5 ; j++) {
         document.write( "<br> >> second : " + i + " : " + j + " : " + k + "<br>") ;
         // if (i=2) continue secundo;
         tertio:
         for (k = 0 ; k<7 ; k++) {
            document.write( " >>>> third : " + i + " : " + j + " : " + k) ;
            if (k <3) continue;
            if (k=3) break tertio;
            if (k=4) break secundo;
            // if ((k==3)||(k==4)) break secundo;
         }
      }
   } 

</script>

</body>
</html>


 

 

 

VIII. Exercices relatifs aux boucles WHILE...

voir suite >>>

 

 

IX. Test relatif aux boucles WHILE...

voir suite >>>

 

 


Le While dans les boucles (20.1) | | Exercices WHILE (20.8)