如何在 JavaScript 中使用标签和 break 语句?


本教程将教会我们如何在 JavaScript 中使用 **标签** 和 **break 语句**。标签和 break 语句在 JavaScript 中并不新鲜,你们中的许多人可能都熟悉它们。标签是一个唯一的字符串,我们可以用它来为 JavaScript 中的代码块、循环、switch 语句等赋予标识。

我们可以将 **break** 关键字与 **标签** 语句一起使用。它会在中间停止代码的执行。

在本教程中,我们将学习如何在循环和代码块中使用标签和 break 语句。

以下是标签和 break 关键字的基本定义。

  • **标签** - 它可以是任何字符串,用来为代码块命名或标记。

  • **Break** - 用于终止代码块、循环或 switch 语句的执行。

语法

用户可以按照以下语法使用标签。

label:
   statement // it can be loop, block of code, etc.

在循环中使用标签语句和 break 关键字

在本节中,我们将学习如何在循环中使用标签语句和 break 关键字。大多数程序员只在循环中使用过 break 语句,但可能没有使用过标签语句。

如果我们在循环中使用 break 语句,它只会中断其所在的父循环,但如果我们想中断 break 关键字父循环的外部循环,我们可以在这些情况下使用标签。

语法

用户可以按照以下语法,使用标签和 break 关键字从子循环中断父循环。

parentLoop: // label for parent loop
   for ( ) {
      childLoop: label for child loop
   for () {
      // body for child loop
      break parentLoop; // breaking parent loop
   }
}

示例 1

在下面的示例中,我们取了两个字符串。我们使用两个循环来匹配并持续匹配字符串的每个字符。如果两个字符串的任何字符相同,我们将使用 break 关键字和父循环的标签停止两个循环的执行。简单来说,我们将学习如何使用标签和 break 从子循环停止父循环的执行。

<html>
<head>
   <title> Using the label with break keyword. </title>
</head>
<body>
   <h2> Using the label with break keyword. </h2>
   <h4> Users can see the flow of for loops and when stops using break keyword.</h4>
   <div id="output"> </div>
   <script>
      let output = document.getElementById("output");
      let str1 = "abcd";
      let str2 = "cdef";
      parentLoop:
      for (let i = 0; i< str1.length; i++) {
         childLoop:
         for (let j = 0; j < str2.length; j++) {
            if (str2[j] == str1[i]) {
               break parentLoop;
            } else {
            output.innerHTML += " str1[ " + i + " ] = " + str1[i] + "    str2[ " + j + " ] = " + str2[j] + "<br/>";
            }
         }
      }
   </script>
</body>
</html>

在上面的输出中,用户可以看到,当 str1 和 str2 的第一个字符匹配时,我们从子循环中中断了父循环,并且它停止打印字符串的字符。在我们的例子中,'c' 是第一个匹配的字符。

示例 2

您可以尝试运行以下代码,学习如何使用带有 break 语句的标签。

<html>
<body>
   <script>
      document.write("Entering the loop!<br /> ");
      outerloop:
      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>

在代码块中使用标签和 break

在本节中,我们将学习如何在代码块中使用标签和 break 关键字。我们可以像在上一节中为循环使用标签一样,为代码块赋予标签。之后,我们可以停止特定代码块的执行。

语法

用户可以查看以下语法,了解如何在代码块中使用标签和 break 关键字。

parentBlock:
   {
      // parent block body
      childBlock: {
         break childBlock;
         // this lines will not be executed
         }
         break parentBlock;
         // this lines of code in parent block will not exeuted.
   }

示例 3

在下面的示例中,我们将使用父和子代码块标签。我们将使用相应代码块的标签和 break 关键字来停止两个代码块的执行。

<html>
<body>
   <h2> Using the label with break keyword. </h2>
   <p> Stops the execution of childBlock and parentBlock using the break keyword and respective labels. </p>
   <div id="output"> </div>
   <script>
      let output = document.getElementById("output");
      parentBlock: {
         output.innerHTML = "parent Block execution started. <br/>";
         childBlock: {
            output.innerHTML += "Execution of the child block has been started. <br/> ";
            break childBlock;
            output.innerHTML += "This will not be executed. <br/>";
         }
         break parentBlock;
         output.innerHTML += "Parent block execution ended. <br/>"
      }
      output.innerHTML += "Outside the parent block. <br/>"
   </script>
</body>
</html>

在上面的输出中,用户可以看到,由于我们在子代码块和父代码块内部使用 break 关键字和标签,它将不会完成两个代码块的执行,并且控制流将跳到父代码块之外。

结论

我们学习了如何将标签与 break 关键字一起使用,并且我们看到了如何使用标签来中断任何其他循环而不是父循环。此外,我们还研究了在代码块中使用标签。

更新于:2022-07-14

791 次查看

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告

© . All rights reserved.