TypeScript language -Guide to use practically in asp.net application


The article contain not only the definination of TypeScript.Help article to developer to create typecsript page and use that in project.so article provide the sample code also.and steps for install ,compile typescript.

What is TypeScript



TypeScript is langauge which is similar to javascript having some new features, help in application like server side application and cloud application.Typescript has features Optional static tying,module support,and use of class.

How to Use TypeScript in current application



First install TypeScriptSetup.0.8.0 on your computer.

Can be downloaded
http://www.microsoft.com/en-us/download/details.aspx?id=34790


Start to develop typscript programming in asp.net application



Create new asp.net application called--TypeScriptProject.

Add new javascript page in project and named it as Libaray.ts

and type code as following


class Libaray
{
fullname:string;
constructor(public firstname,public lastname,public BookName,public DueDateRemain)
{
this.fullname=firstname+ " " +lastname+" "+BookName+" "+DueDateRemain;
}
}

class libDeatil
{
fulldeatils:string;
constructor(public Author,public Publisher)
{
this.fulldeatils=Author+ " "+Publisher
}
}

interface Person{
firstname:string;
lastname:string;
BookName:string;
DueDateRemain:string;


}
interface PersonDetail
{
Author:string;
Publisher:string;

}

function greeter(person:Person)
{
return "Deatils of Libarary Member:::::,"+person.firstname+" "+person.lastname+" "+person.BookName+" "+person.DueDateRemain;

}
function details(dt:PersonDetail)
{
return dt.Author+ " "+dt.Publisher;
}
var user=new Libaray("Rupali","Wanve","Who AM I","20");
var user1=new libDeatil("ABC","xyz");
document.body.innerHTML=greeter(user);
document.title=details(user1);






Compile libarary.ts page



Run command prompt with administrator privilages

e:\typescriptproject\typescriptproject\tsc libarary.ts

Develop web page for typescript



after sucessfull compilation of typescript page refresh the soluation of project.then click on show all files .

oooohh ..you can see new file is generated called libarary.js

which contain the code as follows


var Libaray = (function () {
function Libaray(firstname, lastname, BookName, DueDateRemain) {
this.firstname = firstname;
this.lastname = lastname;
this.BookName = BookName;
this.DueDateRemain = DueDateRemain;
this.fullname = firstname + " " + lastname + " " + BookName + " " + DueDateRemain;
}
return Libaray;
})();
var libDeatil = (function () {
function libDeatil(Author, Publisher) {
this.Author = Author;
this.Publisher = Publisher;
this.fulldeatils = Author + " " + Publisher;
}
return libDeatil;
})();
function greeter(person) {
return "Deatils of Libarary Member:::::," + person.firstname + " " + person.lastname + " " + person.BookName + " " + person.DueDateRemain;
}
function details(dt) {
return dt.Author + " " + dt.Publisher;
}
var user = new Libaray("Rupali", "Wanve", "Who AM I", "20");
var user1 = new libDeatil("ABC", "xyz");
document.body.innerHTML = greeter(user);
document.title = details(user1);




after this just create the page LibarayDetails.aspx

and add code as follows



<script src="Libaray.js"></script>




and just run application you will get output


Details of libarary Member::::rupali wanve who am i 20



So i have created just one simple class for libaray project using TypeScript.


Thanks and Regards
Rupali naik(wanve)


Comments

No responses found. Be the first to comment...


  • Do not include your name, "with regards" etc in the comment. Write detailed comment, relevant to the topic.
  • No HTML formatting and links to other web sites are allowed.
  • This is a strictly moderated site. Absolutely no spam allowed.
  • Name:
    Email: