Strongly Typed JavaScript (TypeScript) – No Excuse Now For Not Diving Deep into JavaScript!!

The mainstay of .NET or for that matter, C# has been its strong type checking which we get at compile time. It's so much a part of C#, that we somewhat take it for granted. If we remove Type checking in C#/VS, we’ll be severely handicapped for sure. Type checking and Intellisense are the 2 most loved features in .NET/Visual Studio without which we (.NET developers) cannot live.

JavaScript has been around for ages, but only in the past 3-4 years has it gained real traction as an application programming language to reckon with. Before this, JavaScript was just considered a scripting language to do minor UI stuff in HTML. Many of you might know that JavaScript is actually an (almost) Object Oriented Language, BUT coding in JavaScript has always been difficult for people who are accustomed to write server code in C# or even Java. Reason being the syntax for doing even simple things like creating classes and interfaces are way different from what we have learnt in C#. It has a steep learning curve. Also, another undoing for JavaScript has been that there weren’t many Dev tools around which could bring in comprehensive Type checking to JavaScript.

This is where TypeScript comes in. I know how I keep on complaining that Microsoft is making life easy for developers by abstracting the intricacies of technology and how at the same time it is making beginner programmers oblivious to the “real” way things work in the WEB. And TypeScript is another shot at the same thing by Microsoft. TypeScript may abstract developers from the actual JavaScript syntax, but it’ll encourage developers to code more in JavaScript, which will in turn result in more beautiful and responsive designs.

TypeScript is an Microsoft open source project. I know to some people it may sound like an Oxymoron (Microsoft and Open source !! ), BUT that’s how the Ship is being steered recently at Microsoft.

There have been a lot of open source projects Microsoft has published (like Entity Framework, ASP.NET MVC, etc.) recently, so it is something people should get used to.

So, What is TypeScript?

TypeScript is a superset of JavaScript actually, which eventually compiles to JavaScript, BUT the syntax for TypeScript is more along the lines of other OO languages like C#. Moreover, any JavaScript code is a valid TypeScript code. Also TypeScript brings along with it Intellisense and (good enough) type checking during development time.

How Do I Use TypeScript?

You could just download and install the TypeScript Plugin for VS 2012 from Microsoft and you can straight away start using TypeScript. TypeScript files are files with extension .ts, and they can be compiled to JavaScript (.js) files simply by calling the TypeScript compiler (tsc.exe) from command prompt.

Enough of Gyan, its time for some quick examples to showcase why every JavaScript application developer should use TypeScript. I’ll demonstrate this with a very simple example. Say we need to declare and use a class in JavaScript.

The code we’ll need to write in JavaScript would look like this:

var Person = (function () {
function Person(Name, Age) {
this.Name = Name;
this.Age = Age;
}
Person.prototype.SayHi = function () {
return "Hello, " + this.Name;
};
return Person;
})();

var person = new Person("Sam", 28);

console.log(person.SayHi());

As can be seen from the above code, it's not exactly how a C# programmer would go about creating and using classes.

If we write the same code in TypeScript, it would look something like below:

class Person {
Name: string;
Age : number;
constructor(Name: string, Age:number) {
this.Name = Name;
this.Age = Age;
}

SayHi() {
return "Hello, " + this.Name;
}
}

var person = new Person("Sam",28)

console.log(person.SayHi())

The above code when compiled using tsc.exe produces a JS file which has the exact code written previously.

Moreover, you also get Intellisense as well as Type Checking (familiar territory ) in Visual Studio while using TypeScript:

Where Can I Quickly Learn TypeScript?

http://www.typescriptlang.org/ is your GOTO site for anything related to TypeScript. It features some quick demos and a nice video tutorial for you to get started with TypeScript. It also has a detailed Language Specifications which is surprisingly very user friendly.

Also the website has a very cool Playground where you can try out some examples using TypeScript and it’ll generate the JavaScript side-by-side.

I would say no programming language (like JavaScript) is difficult to learn if the tools provided are good enough. Of course, you’ll have to be aware of the tools (like TypeScript) available at hand to accomplish the same.

If you have any further queries regarding using TypeScript, please give me a shout in the comments section.