Updated March 17, 2023
Introduction to Break Statement in JavaScript
Break Statement is used to change a program’s function. Loops are being used to conduct such statement sequences for a couple of times before the outcome of the test is inaccurate. There could be some circumstances where, without performing most of the sentences, we can exit the statement. We could use the break statement in javascript in these circumstances. The break statement is used in a switch statement, which is split out from the switch block. Within the mentioned label, the break statement must be nested. Each and every block statement can be the marked statement; a loop statement does not need to precede it.
If the JavaScript compiler discovers the break statement within them while performing for loop, while loop and do-while loop, the loop will prevent performing the statements and exit the loop instantly.
Syntax:
break;
Code:
var n = 0;
while (n < 5) {
if (n === 3) {
break;
}
n = n + 1;
}
console.log(n);
Output:
3
Flowchart
Flowchart for Break Statement in JavaScript:
The flowchart for the break statement is as shown in the below image:
How does Break Statement Work in JavaScript?
The break statement divides the loop as we use the break statement inside a loop and continues after the loop to initiate the code. You could also use a label-connected break statement to exit JavaScript’s code block. In a simple way, whenever a match is made, and the work is done if the break statement is met. Therefore, the switch statement should continue to analyze the expression.
We must be sure that the statement being implemented is the first match When you want various combinations to cause blocks of code then this would be prevented by the break statement. The last instance in a switch block doesn’t need to be broken. Either way, the block breaks there.
Examples of Break Statement in JavaScript
Given below are the examples mentioned:
Example #1
Break statement inside for loop.
Code:
<!DOCTYPE html>
<html>
<head>
<title> JavaScript Break Statement</title>
</head>
<body>
<h2> JavaScript Break Statement </h2>
<script>
var n;
for (n = 10; n > 0; n--)
{
if(n == 5)
{
document.write("<br\>Exiting the loop: n = " + n);
break;
}
document.write("<br\><b>The numbers are:</b>= " + n);
}
</script>
</body>
</html>
Explanation:
- Save the above code in the html format.
- Run the code in the web browser.
Output:
Example #2
Break statement inside while loop.
Code:
<!DOCTYPE html>
<html>
<head>
<title> JavaScript Break Statement</title>
</head>
<body>
<h2> JavaScript Break Statement </h2>
<script>
var n = 0;
while (n <= 10)
{
document.write("<br \ > <b>The numbers are:</b>= " + n);
n++;
if(n == 5)
{
break;
}
}
document.write("<br \> Exiting the loop: n = " + n);
</script>
</body>
</html>
Output:
Example #3
Break Statement inside div tag.
Code:
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript Break statement
</title>
</head>
<body style="text-align:left;">
<div>
<h2>JavaScript Break Statement</h2>
</div>
<p id="brk_stmt_id"></p>
<script>
var myvalue = "";
var n;
for (n = 1; n < 10; n++) {
if (n === 5) {
break;
}
myvalue += "Educba" + n + "<br>";
}
document.getElementById("brk_stmt_id").innerHTML = myvalue;
</script>
</body>
</html>
Output:
Example #4
Using break label statements.
Code:
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript Break Statement
</title>
</head>
<body>
<div>
<h2>JavaScript Break Statement</h2>
</div>
<p id="brk_stmt_id"></p>
<script>
var res = ["Educab1", "Educba2", "Educba3", "Educba4", "Educba5"];
var value = "";
breaklabel: {
value += res[0] + "<br>" + res[1] + "<br>";
break breaklabel;
value += res[2] + "<br>"+ res[3] + "<br>" + res[4];
}
document.getElementById("brk_stmt_id").innerHTML = value;
</script>
</body>
</html>
Output:
Example #5
Break statement inside inner loop.
Code:
<html>
<head>
<title>
JavaScript Break Statement
</title>
</head>
<body>
<script type = "text/javascript">
document.write("Starting of the loop ...<br/> ");
outerloop: // indicates name of the label
for (var m = 0; m < 5; m++) {
document.write("Outside the loop: " + m + "<br />");
innerloop:
for (var n = 0; n < 5; n++) {
if (n > 3 ) break ;
if (m == 2) break innerloop;
if (m == 4) break outerloop;
document.write("Inside the loop: " + n + " <br/>");
}
}
document.write("End of the loop...<br /> ");
</script>
</body>
</html>
Output:
Example #6
Break statement in switch case.
Code:
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript Break Statement
</title>
</head>
<body>
<script type = "text/javascript">
var value = 'two';
document.write("The switch case is entering into the program...<br />");
switch (value) {
case 'one': document.write("Result is: This is First statement...<br />");
break;
case 'two': document.write("Result is: This is Second statement...<br />");
break;
case 'three': document.write("Result is: This is Third statement...<br />");
break;
case 'four': document.write("Result is: This is Fourth statement...<br />");
break;
case 'five': document.write("Result is: This is Five statement...<br />");
break;
default: document.write("Result is: This is last statement...<br />")
}
document.write("Switch case is exiting out of the program...");
</script>
</body>
</html>
Output:
Conclusion
It is very helpful to get through any loop including JavaScript For Loop, JavaScript While Loop, and JavaScript Do While Loop. If the JavaScript compiler detects the break statement inside themselves when implementing these loops, the loop would stop performing the statements and exit the loop instantly. In a simple way, whenever a match is found, and if the break statement is encountered, the work is performed. The switch statement must, therefore, begin to examine the expression. We have also used a switch case for a break statement, where the switch statement analyses an expression that matches the value of the expression to a case clause and conducts statements pertaining to that case, as well as statements in cases.
Recommended Articles
This is a guide to Break Statement in JavaScript. Here we discuss the working and different examples of break statements in JavaScript with code and output. You may also look at the following articles to learn more-