Arithmetic Operations Using TypeScript

Vijay Prativadi
12y
4.4k
0
0

Article

Introduction

Today, in this article let's play around with one of the interesting and most useful concepts in TypeScript.

Question: What is arithmetic operations using TypeScript?

In simple terms "It enables arithmetic operations to be performed using the TypeScript language.".

Step 1: Create a new TypeScript Project; see:

Step 2: The complete code of app.ts looks like this:

class Arthmetic implements IAddition
{
    public Add (a:number, b:number): number
    {
        return a + b;
    }
    public Sub (a:number, b:number): number
    {
        return a - b;
    }
    public Mul (a:number, b:number): number
    {
        return a * b;
    }
    public Div (a:number, b:number): number
    {
        return a / b;
    }
}
interface IAddition
{
    Add(a: number, b: number): number;
    Sub(a: number, b: number): number;
    Mul(a: number, b: number): number;
    Div(a: number, b: number): number;}
    function arthemticAdd(arthmetic: Arthmetic)
    {
        return "Addition Result of 20 and 10 is: " + arthmetic.Add(20, 10);
    }
    function arthemticSub(arthmetic: Arthmetic)
    {
        return "Substraction Result of 20 and 10 is: " + arthmetic.Sub(20, 10);
    }
    function arthemticMul(arthmetic: Arthmetic)
    {
        return "Multiplication Result of 20 and 10 is: " + arthmetic.Mul(20, 10);
    }
    function arthemticDiv(arthmetic: Arthmetic)
    {
        return "Division Result of 20 and 10 is: " + arthmetic.Div(20, 10);
    }
    var objArthmetic = new Arthmetic();
    alert(arthemticAdd(objArthmetic));
    alert(arthemticSub(objArthmetic));
    alert(arthemticMul(objArthmetic));
    alert(arthemticDiv(objArthmetic));
}

Step 3: The complete code of Default.htm looks like this:

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>Arithmetic TypeScript App</title>
    <link rel="stylesheet" href="app.css" type="text/css" />
</head>
<body>
    <h1 style="text-align: center">
        Arithmetic TypeScript App</h1>
    <div id="content">
        <script src="app.js"></script>
    </div>
</body>
</html>

Step 4: The addition operation output of the application looks like this:

Step 5: The subtraction operation output of the application looks like this:

Step 6: The multiplication operation output of the application looks like this:

Step 7: The division operation output of the application looks like this:

I hope this article is useful for you. I look forward for your comments and feedback. Thanks Vijay Prativadi

Up Next

MVC Corporation

MVC Corporation is consulting and IT services based company.