Find Hypotenuse of a Number In TypeScript

Introduction

 
In this article, I explain how to find the hypotenuse. A Hypotenuse of a number is the square root of the sum of two square numbers. For example, suppose there are two numbers say a and b. The addition of the squares of these numbers is a*a + b*b. Now the Hypotenuse of the number c is represented as:
 
c*c = a*a + b*b
 
So the value of c will be the square root of a*a + b*b number. To see how it works, use the following instructions:
 
Let's create a TypeScript app in Visual Studio and write our code.  
 
Step 1. Open Visual Studio 2012 and click on "File" -> "New" -> "Project...". A window is shown. In that window select HTML application with TypeScript under the Visual C# template and then give the name of your application and then click OK.
 
New-Project-Selection-In-TypeScript.jpg 
 
Step 2. The TypeScript application contains a file, "app.ts", which is the TypeScript file, "app.js" which is the JavaScript file, "app.css" which is the StyleSheet and "default.html" which is the HTML file. 
 
Structure -Of-TypeScript-Language.jpg 
 
Step 3. Now open the app.ts TypeScript file and write the code as: 
  1. class Point {  
  2. x: number;  
  3. y: number;  
  4. constructor(x: number, y: number) {  
  5. this.x = x;  
  6. this.y = y;  
  7. }  
  8. hypotenuse() {  
  9. return Math.sqrt(this.x * this.x + this.y * this.y);  
  10. }  
  11. }  
  12. var p = new Point(3,4);  
  13. var dist = p.hypotenuse();  
  14. alert("Hypotenuse of 3 and 4 is: " + dist);  
In this file, I create a class name Point which takes two parameters x and y of number type, these two parameters are passed to the constructor, to be processed in the function. Now a function named Hypotenuse is declared which returns the Square root of the sum of these squares of numbers. All this work is done in the class. Now outside of the class an object of this class p is created in which I passed the two parameters values that are 3 and 4. Now the function of the object is called which returns the result and is displayed in the alert box.
 
Step 4. Open the app.js file and write the code as: 
  1. var Point = (function () {  
  2. function Point(x, y) {  
  3. this.x = x;  
  4. this.y = y;  
  5. }  
  6. Point.prototype.hypotenuse = function () {  
  7. return Math.sqrt(this.x * this.x + this.y * this.y);  
  8. };  
  9. return Point;  
  10. })();  
  11. var p = new Point(3, 4);  
  12. var dist = p.hypotenuse();  
  13. alert("Hypotenuse of 3 and 4 is: " + dist);  
Step 5. Open the default.htm file and write the code as:
  1. <!DOCTYPE html>  
  2. <html lang="en" xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta charset="utf-8" />  
  5. <title>Hypotenuse Example</title>  
  6. <link rel="stylesheet" href="app.css" type="text/css" />  
  7. </head>  
  8. <body>  
  9. <h1>Finding Hypotenuse</h1>  
  10. <div id="content">  
  11. <script src="app.js">  
  12. </script>  
  13. </div>  
  14. </body>  
  15. </html>  
Step 6. Now run the application. The output will look like:
 
Finding-Hypotenuse-In-tYpeScript.jpg
 
Summary
 
In this article, I explained how to find the Hypotenuse using TypeScript.