Post
Ask Question

Get Area Of Square In TypeScript

Introduction

 
Today, I am going to explain how to perform various square operations in TypeScript. A square has four equal sides and four equal angles (which are of 90 degrees). In this code example, we will learn the following: 
  • Area of a Square
  • Parameter of a Square
  • Diagonal value of the Square
The area of the square is calculated by multiplying the side of the square by its own side. The parameter is calculated by multiplying the side by 4. 
  • Area= Side * Side
  • Parameter = 4 * Side
  • Diagonal = Squart_Root ( Side * Side + Side* Side) 
Let's follow these steps.
 
Step 1. Open Visual Studio 2012 and click "File" -> "New" -> "Project...".
 
Step 2. Select HTML Application for TypeScript under Visual C# and give the name of your application then click ok.
 
Step 3. Open the app.ts file and write the TypeScript code as: 
  1. class Square_Side {  
  2.  x: number;  
  3.  constructor(x: number) {  
  4.   this.x = x;  
  5.  }  
  6.  AreaOfSquare() {  
  7.   return this.x * this.x;  
  8.  }  
  9.  ParameterOfSquare() {  
  10.   return 4 * this.x;  
  11.  }  
  12.  DiagonalOfSquare() {  
  13.   return Math.sqrt(this.x * this.x + this.x + this.x);  
  14.  }  
  15. }  
  16. var side = new Square_Side(5);  
  17. var area = side.AreaOfSquare();  
  18. var parameter = side.ParameterOfSquare();  
  19. var diagonal = side.DiagonalOfSquare();  
  20. alert("The side of the Square is : 5");  
  21. alert("The Area of the Square is :" + area);  
  22. alert("The parameter of the Square is :" + parameter);  
  23. alert("The Diagonal of the Square is :" + diagonal);   
Step 4. Write the JavaScript code in the app.js file as:
  1. var Square_Side = (function() {  
  2.  function Square_Side(x) {  
  3.   this.x = x;  
  4.  }  
  5.  Square_Side.prototype.AreaOfSquare = function() {  
  6.   return this.x * this.x;  
  7.  };  
  8.  Square_Side.prototype.ParameterOfSquare = function() {  
  9.   return 4 * this.x;  
  10.  };  
  11.  Square_Side.prototype.DiagonalOfSquare = function() {  
  12.   return Math.sqrt(this.x * this.x + this.x + this.x);  
  13.  };  
  14.  return Square_Side;  
  15. })();  
  16. var side = new Square_Side(5);  
  17. var area = side.AreaOfSquare();  
  18. var parameter = side.ParameterOfSquare();  
  19. var diagonal = side.DiagonalOfSquare();  
  20. alert("The side of the Square is : 5");  
  21. alert("The Area of the Square is :" + area);  
  22. alert("The parameter of the Square is :" + parameter);  
  23. alert("The diagonal of the Square is :" + diagonal);   
Step 5. Open the default.htm file and write the HTML code in it as:
  1. <!DOCTYPE html>  
  2. <html lang="en"  
  3.     xmlns="http://www.w3.org/1999/xhtml">  
  4.     <head>  
  5.         <meta charset="utf-8" />  
  6.         <title>TypeScript HTML App</title>  
  7.         <link rel="stylesheet" href="app.css" type="text/css" />  
  8.     </head>  
  9.     <body>  
  10.         <h1>Square Function</h1>  
  11.         <div id="content">  
  12.             <script src="app.js"></script>  
  13.         </div>  
  14.     </body>  
  15. </html>     
Step 6. Now run the application.
 
Summary
 
In this article, I explained how to find the area, parameter and diagonal value of a square using TypeScript.


Similar Articles