Codechef4u is a community for computer professionals,by computer professionals,just like you; who loves sharing and helping each others,Join them
Share your post

Interfaces in TypeScript

Interfaces provide the ability to name and parameterize object types and to compose existing named object types into new ones.

Interfaces have no run-time representation—they are purely a compile-time construct. Interfaces are particularly useful for documenting and validating the required shape of properties, objects passed as parameters, and objects returned from functions.

Here we use an interface that describes objects that have a firstName and lastName field. In TypeScript, two types are compatible if their internal structure is compatible. This allows us to implement an interface just by having the shape the interface requires, without an explicit implements clause.

Typescript interface code example:

interface IEmployee {
    firstName: string;
    lastName: string;
}
 
function getFullName(person: IEmployee) {
    return "Hello, " + person.firstName + " " + person.lastName;
}
 
var user = { firstName: "Shourya", lastName: "Kendre" };
 
window.onload = () => {
    var elFullNameName = document.getElementById('lblFullNameName');
    elFullNameName.innerHTML = getFullName(user); 
};


HTML code:

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>TypeScript HTML App</title>
    <link rel="stylesheet" href="app.css" type="text/css" />
    <script src="InterfaceExample.js"></script>
</head>
<body>
    <h1>TypeScript HTML App</h1>
<label id="lblFullNameName"></label>
</body>
</html>


Result Page:


धन्यवाद मित्रानो !!!


TypeScript function types

Function types in TypeScript 

TypeScript function types make it possible for programmers to express the expected signature of a function. A function signature is a sequence of parameter types plus a return type.

 

TypeScript function type sample code:

 

function MyVote(candidate: string, callback: (result: string) => any) { //here some code ... }
 
    MyVote("MyParty", function (result: string) { if (result === "MyParty") { //here ur code ... } } );

In detail:

A function’s type has the same two parts: the type of the arguments and the return type. When writing out the whole function type, both parts are required. We write out the parameter types just like a parameter list, giving each parameter a name and a type.

//simple js function

        function add(x, y) {
            return x + y;
        }

 

 //typescript simple function type implementation

        function add(x: number, y: number): number {
            return x + y;
        }
        let myAdd = function (x: number, y: number): number { return x + y; };

 

 

//Typescript proper function type use

      let myAdd: (baseValue: number, increment:
number) => number =
      function (x: number, y: number): number { return x + y; };