Break Statement in TypeScript

In this article, I am going to explain how to use a break statement in TypeScript with an example.

Break Statement in TypeScript

 
The break statement can be used to influence the flow of execution during the execution of the loop statement, or say in other words the break statement can be used to terminate an iteration statement and will, when executed, cause the control flow to jump out to the next statement immediately following the iteration statement. In switch-case statements, break causes the remaining cases to be skipped and it prevents "falling through" to other cases.
 
The Break statement is only used within the loop and switch-case statements.
 
Syntax:
  1. break;  
The following example tells you, how to use a break statement in TypeScript. You can use an existing TypeScript file or create a new project using the following steps to create a program that uses the TypeScript break keyword. 
 
Step 1
Open Visual Studio and click on "File" menu -> "New" -> "Project". A window will be opened. Provide the name of your application like "break statement", then click on the Ok button.
 
Step 2
After Step 1 your project has been created. The Solution Explorer, which usually is in the right side of Visual Studio, contains the js file, ts file, CSS file, and HTML files.
 
Step 3
The code of the break statement program is:
 
breakStatement.ts 
  1. class breakStatement {  
  2.  BreakFunction() {  
  3.   for (var n = 1; n <= 5; n++) {  
  4.    var y = document.createElement("y");  
  5.    y.innerText = n.toString();  
  6.    alert("hi" + n);  
  7.    y.innerText = "Number= " + n + "\n";  
  8.    document.body.appendChild(y);  
  9.    if (n == 4) {  
  10.     break;  
  11.    }  
  12.   }  
  13.  }  
  14. };  
  15. window.onload = () => {  
  16.  var value = new breakStatement();  
  17.  value.BreakFunction();  
  18. }   
default.html 
  1. <!DOCTYPEhtml>  
  2. <htmllang="en"  
  3.     xmlns="http://www.w3.org/1999/xhtml">  
  4.     <head>  
  5.         <metacharset="utf-8"/>  
  6.         <title>TypeScript HTML App</title>  
  7.         <linkrel="stylesheet"href="app.css"type="text/css"/>  
  8.         <scriptsrc="app.js">  
  9.         </script>  
  10.     </head>  
  11.     <body>  
  12.         <h1>TypeScript HTML App</h1>  
  13.         <divid="content"/>  
  14.     </body>  
  15. </html>  
app.js 
  1. var breakStatement = (function() {  
  2.  function breakStatement() {}  
  3.  breakStatement.prototype.BreakFunction = function() {  
  4.   for (var n = 1; n <= 5; n++) {  
  5.    var y = document.createElement("y");  
  6.    y.innerText = n.toString();  
  7.    alert("hi" + n);  
  8.    y.innerText = "Number= " + n + "\n";  
  9.    document.body.appendChild(y);  
  10.    if (n == 4) {  
  11.     break;  
  12.    }  
  13.   }  
  14.  };  
  15.  return breakStatement;  
  16. })();;;  
  17. window.onload = function() {  
  18.  var value = new breakStatement();  
  19.  value.BreakFunction();  
  20. };   
Step 4
Run your program and the output of the program is:
 
break-statement-in-typescript1.jpg
 
After clicking on the ok button:
 
break-statement-in-typescript2.jpg
 
The final output is:
 
break-statement-in-typescript.jpg 
 

Summary

 
In this article and code sample, we saw how to use a break statement in TypeScript.
 
TypeScript is growing and getting popular each day. TypeScript is used with the various open-source project including React, Angular, Node, Babel, React Native, Vue.js, ASP.NET Core, and Knockout.  
 
If you're new to TypeScript, start here: Quick Start with TypeScript