JavaScript предоставляет полный контроль для обработки циклов и операторов switch. Может возникнуть ситуация, когда вам нужно выйти из цикла, не достигнув ее нижней части. Также может возникнуть ситуация, когда вы хотите пропустить часть своего кодового блока и начать следующую итерацию внешнего вида.

Для обработки всех таких ситуаций JavaScript предоставляет инструкции break и continue. Эти операторы используются для немедленного выхода из любого цикла или для запуска следующей итерации любого цикла соответственно.

Заявление о прерывании

Оператор break, который был кратко введен с помощью оператора switch, используется для выхода из цикла раньше, вырывающегося из закрывающих фигурных скобок.

Блок-схема

Блок-схема инструкции break будет выглядеть следующим образом:

JavaScript - управление циклом пример

Следующий пример иллюстрирует использование оператора break с циклом while. Обратите внимание на то, как цикл распадается раньше, когда x достигает 5 и достигает инструкции document.write(..) чуть ниже до закрывающей фигурной скобки -

<html>
   <body>
     
      <script type="text/javascript">
         <!--
         var x = 1;
         document.write("Entering the loop
 ");
        
         while (x < 20)
         {
            if (x == 5){
               break; // breaks out of loop completely
            }
            x = x + 1;
            document.write( x + "
");
         }
        
         document.write("Exiting the loop!
 ");
         //-->
      </script>
     
   </body>
</html>
Результат
Entering the loop
2
3
4
5
Exiting the loop!

Мы уже видели использование оператора break внутри оператора switch.

Утверждение о продолжении

Оператор continue сообщает интерпретатору немедленно запустить следующую итерацию цикла и пропустить оставшийся блок кода. Когда встречается оператор continue, поток программы немедленно переходит к выражению проверки цикла, и если условие остается истинным, тогда он запускает следующую итерацию, иначе элемент управления выходит из цикла.

пример

Этот пример иллюстрирует использование оператора continue с циклом while. Обратите внимание, как используется оператор continue для пропуска печати, когда индекс, содержащийся в переменной x, достигает 5 -

<html>
   <body>
     
      <script type="text/javascript">
         <!--
            var x = 1;
            document.write("Entering the loop
 ");
        
            while (x < 10)
            {
               x = x + 1;
              
               if (x == 5){
                  continue; // skill rest of the loop body
               }
               document.write( x + "
");
            }
        
            document.write("Exiting the loop!
 ");
         //-->
      </script>
     
      <p>Set the variable to different value and then try...</p>
   </body>
</html>
Результат
Entering the loop
2
3
4
6
7
8
9
10
Exiting the loop!

Использование меток для управления потоком

Начиная с JavaScript 1.2, метку можно использовать с разрывом и продолжать более точно контролировать поток. Метка является просто идентификатором следует двоеточие (:) , который применяется к оператору или блоку кода. Мы увидим два разных примера, чтобы понять, как использовать метки с разрывом и продолжить.

Примечание. Разрывы строк не допускаются между оператором «continue» или «break» и его именем метки. Кроме того, между именем метки и связанным с ней циклом не должно быть никакого другого оператора.

Пример 1

В следующем примере показано, как реализовать метку с инструкцией break.

<html>
   <body>
     
      <script type="text/javascript">
         <!--
            document.write("Entering the loop!
 ");
            outerloop: // This is the label name
        
            for (var i = 0; i < 5; i++)
            {
               document.write("Outerloop: " + i + "
");
               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 + " 
");
               }
            }
        
            document.write("Exiting the loop!
 ");
         //-->
      </script>
     
   </body>
</html>
Результат
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!

Пример 2.

<html>
   <body>
  
      <script type="text/javascript">
         <!--
         document.write("Entering the loop!
 ");
         outerloop: // This is the label name
        
         for (var i = 0; i < 3; i++)
         {
            document.write("Outerloop: " + i + "
");
            for (var j = 0; j < 5; j++)
            {
               if (j == 3){
                  continue outerloop;
               }
               document.write("Innerloop: " + j + "
");
            }
         }
        
         document.write("Exiting the loop!
 ");
         //-->
      </script>
     
   </body>
</html>
Результат
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!

Понравилась статья? Поделитесь ею с друзьями и напишите отзыв в комментариях!



We use cookies on our website. Some of them are essential for the operation of the site, while others help us to improve this site and the user experience (tracking cookies).

You can decide for yourself whether you want to allow cookies or not. Please note that if you reject them, you may not be able to use all the functionalities of the site.

Ok