About Hasmukh patel

My Photo
Harrow, London, United Kingdom
Dot-Net developer with expertise in Web, WPF, Win-form applications. Have worked on Asp.net,mvc , WPF and Win-forms projects in c#.net language having Sql-Server/Oracle as database with service oriented architecture using test driven development. Having complete knowledge of SDLC and have successfully worked and implemented it on projects.

TypeScript basics


 TypeScript is a free and open source programming language developed by Microsoft to generate JavaScript from class-based object oriented programming language. TypeScript supports ECMAScript 6 classes that integrate the optional type annotations support.
Install TypeScript
You can install TypeScript via an nuget package manger package for node.js or as an MSI that integrates with Visual Studio 2012.
After installing, TypeScript for Visual Studio 2012 you can create TypeScript file .TS file and edit in TypeScript editor.
Example of TypeScript (TypeScript/TestScript.ts is a file name)
// Interface
interface IPoint {
    getDist(): number;
}

// Module
module Shapes {

    // Class
    export class Point implements IPoint {
        // Constructor
        constructor (public x: numberpublic y: number) { }

        // Instance member
        getDist() { return Math.sqrt(this.x * this.x + this.y * this.y); }

        // Static member
        static origin = new Point(00);
    }

}

// Local variables
var p: IPoint = new Shapes.Point(34);
var dist = p.getDist();
Manual Compile TypeScript
Go to command prompt, then type
>tsc ../TypeScripts/TestScript.ts --out ../Scripts/TestScrip.js
Compile with Web project
Go to web project property and type "tsc ../TypeScripts/TestScript.ts --out ../Scripts/TestScrip.js" in the Build Events' Pre-build event command line textbox.
If you have multiple files then create a text file and type all command in that file and change above command as "tsc @../TypeScripts/Scripts.txt"
There is a Compile-on-save feature available with  Visual Studio TypeScript editor.
References from another library
e.g. JQuery example
You need to add a reference to the jQuery definition at the top of your .ts file.
/// <reference path="jquery.d.ts"/>

/// <reference path="someclass.ts"/>


e.g.
//MainModule.ts
// Interface
interface IPerson {
    age: number;
    name: string;
    getDetails(): string;
}

// Module
module MainModule {

    // Class
    export class PersonBase implements IPerson {
        // Constructor
        constructor (public age: numberpublic name: string) { }

        getDetails() { return this.name + ' ' + this.age; }
    }
}

//PersonProcessor.ts
/// <reference path="./MainModule.ts" />
module PersonProcesser { 
    
    //derived class from  personBase
    export class  Person extends MainModule.PersonBase implements IPerson
    { 
        address: string;
        //Constructor
        constructor (age:number, name:string, addr: string){
            super(age, name);
            this.address = addr;
        }

        getDetails() { return this.name + ' ' + this.age + ' ' + this.address; }
    }
}
// Local variables
var person : IPerson = new PersonProcesser.Person(20,"abc""abc street, xyz city")
var details = person.getDetails();
Get more details about TypeScript modules.

TypeScript type definitions repository for popular JavaScript libraries

1 comment :

for ict 99 said...

TypeScript is mandatory for Angular.JS 2

Typescript Training