JavaScript - Controllo del ciclo

JavaScript fornisce il controllo completo per gestire i loop e le istruzioni switch. Potrebbe esserci una situazione in cui è necessario uscire da un ciclo senza raggiungere il fondo. Potrebbe anche verificarsi una situazione in cui si desidera saltare una parte del blocco di codice e avviare l'iterazione successiva del ciclo.

Per gestire tutte queste situazioni, JavaScript fornisce break e continuedichiarazioni. Queste istruzioni vengono utilizzate per uscire immediatamente da qualsiasi ciclo o per avviare rispettivamente l'iterazione successiva di qualsiasi ciclo.

La dichiarazione di rottura

Il breakL'istruzione, che è stata introdotta brevemente con l' istruzione switch , viene utilizzata per uscire da un ciclo in anticipo, rompendo le parentesi graffe che lo racchiudono.

Diagramma di flusso

Il diagramma di flusso di un'istruzione break dovrebbe apparire come segue:

Esempio

Il seguente esempio illustra l'uso di un file breakistruzione con un ciclo while. Nota come il ciclo si interrompe presto una voltax raggiunge 5 e raggiunge document.write (..) dichiarazione appena sotto alla parentesi graffa di chiusura -

<html>
   <body>     
      <script type = "text/javascript">
         <!--
         var x = 1;
         document.write("Entering the loop<br /> ");
         
         while (x < 20) {
            if (x == 5) {
               break;   // breaks out of loop completely
            }
            x = x + 1;
            document.write( x + "<br />");
         }         
         document.write("Exiting the loop!<br /> ");
         //-->
      </script>
      
      <p>Set the variable to different value and then try...</p>
   </body>
</html>

Produzione

Entering the loop
2
3
4
5
Exiting the loop!
Set the variable to different value and then try...

Abbiamo già visto l'utilizzo di break dichiarazione all'interno a switch dichiarazione.

La dichiarazione continue

Il continueindica all'interprete di avviare immediatamente la successiva iterazione del ciclo e di saltare il blocco di codice rimanente. Quando uncontinue viene rilevata l'istruzione, il flusso del programma si sposta immediatamente sull'espressione di controllo del ciclo e se la condizione rimane vera, avvia l'iterazione successiva, altrimenti il ​​controllo esce dal ciclo.

Esempio

Questo esempio illustra l'uso di un file continueistruzione con un ciclo while. Nota come il filecontinue viene utilizzata per saltare la stampa quando l'indice è contenuto nella variabile x raggiunge 5 -

<html>
   <body>      
      <script type = "text/javascript">
         <!--
            var x = 1;
            document.write("Entering the loop<br /> ");
         
            while (x < 10) {
               x = x + 1;
               
               if (x == 5) {
                  continue;   // skip rest of the loop body
               }
               document.write( x + "<br />");
            }         
            document.write("Exiting the loop!<br /> ");
         //-->
      </script>      
      <p>Set the variable to different value and then try...</p>
   </body>
</html>

Produzione

Entering the loop
2
3
4
6
7
8
9
10
Exiting the loop!
Set the variable to different value and then try...

Utilizzo delle etichette per controllare il flusso

A partire da JavaScript 1.2, è possibile utilizzare un'etichetta con break e continueper controllare il flusso in modo più preciso. UNlabelè semplicemente un identificatore seguito da due punti (:) applicato a un'istruzione o a un blocco di codice. Vedremo due diversi esempi per capire come utilizzare le etichette con break and continue.

Note - Non sono consentite interruzioni di riga tra i file ‘continue’ o ‘break’dichiarazione e il nome dell'etichetta. Inoltre, non dovrebbero esserci altre istruzioni tra il nome di un'etichetta e il ciclo associato.

Prova i seguenti due esempi per una migliore comprensione delle etichette.

Esempio 1

L'esempio seguente mostra come implementare Label con un'istruzione break.

<html>
   <body>      
      <script type = "text/javascript">
         <!--
            document.write("Entering the loop!<br /> ");
            outerloop:        // This is the label name         
            for (var i = 0; i < 5; i++) {
               document.write("Outerloop: " + i + "<br />");
               innerloop:
               for (var j = 0; j < 5; j++) {
                  if (j > 3 ) break ;           // Quit the innermost loop
                  if (i == 2) break innerloop;  // Do the same thing
                  if (i == 4) break outerloop;  // Quit the outer loop
                  document.write("Innerloop: " + j + " <br />");
               }
            }        
            document.write("Exiting the loop!<br /> ");
         //-->
      </script>      
   </body>
</html>

Produzione

Entering the loop!
Outerloop: 0
Innerloop: 0 
Innerloop: 1 
Innerloop: 2 
Innerloop: 3 
Outerloop: 1
Innerloop: 0 
Innerloop: 1 
Innerloop: 2 
Innerloop: 3 
Outerloop: 2
Outerloop: 3
Innerloop: 0 
Innerloop: 1 
Innerloop: 2 
Innerloop: 3 
Outerloop: 4
Exiting the loop!

Esempio 2

<html>
   <body>
   
      <script type = "text/javascript">
         <!--
         document.write("Entering the loop!<br /> ");
         outerloop:     // This is the label name
         
         for (var i = 0; i < 3; i++) {
            document.write("Outerloop: " + i + "<br />");
            for (var j = 0; j < 5; j++) {
               if (j == 3) {
                  continue outerloop;
               }
               document.write("Innerloop: " + j + "<br />");
            }
         }
         
         document.write("Exiting the loop!<br /> ");
         //-->
      </script>
      
   </body>
</html>

Produzione

Entering the loop!
Outerloop: 0
Innerloop: 0
Innerloop: 1
Innerloop: 2
Outerloop: 1
Innerloop: 0
Innerloop: 1
Innerloop: 2
Outerloop: 2
Innerloop: 0
Innerloop: 1
Innerloop: 2
Exiting the loop!