TypeScript

Design brief

• Solution Need: Creating large-scale JavaScript applications is hard.

• Loss of efficiency: The structures and definitions that are not included.

• Compensations: leveraging is achieved through integrating alternate frameworks, IDE, and other tools.

Efficiencies

• Aim: TypeScript enables JavaScript as a base language for its application development methodology.

• Solution Achievement: TypeScript is a (type) superset of the base language that compiles out as standards oriented JavaScript.

• Usability: cross - browser, OS, host, device.
• Availability: all open source.
• Exclusion of solutions: none - all JavaScript solutions are still available (if not redundant). e.g. jQuery.

Effectiveness

Effectiveness: the features, inclusions, and super-set are the underpinning of developing large applications.

Advantages

• Cost: self supported, zero purchase.
• Training: minimized due to using a working language standard.

Methodology

• Loss of efficiency: The type-system enables expressed limits on the capabilities of JavaScript objects, with tools to enforce limits.

First Solution

• Achievement: TypeScript allows annotation of parameters

The following can be used in a dot-ts file for TypeScript

function gees (x:string){
var foo= x + x;
alert(foo);
}

:string is the annotation not normally part of JavaScript. TypeScript annotates a semantic subset onto JavaScript to throw errors on nonsensical activity.

function gees (x:number){
var foo = x + x;
alert(foo);
}

In this example the error is created by the alert being an object for strings.

The annotation can also deliver early structuring. As an array:

function foo (x: string[]){
x[0].length
}

function foo (x: () -> string){
x()
}

Second Solution

• Achievement: Minimizing the number of annotations needed
• The type-system makes extensive use of type inference.
  • TypeScript will infer that the variable ‘i’ has the type number. var i = 0;
  • TypeScript will infer from the following function definition that the function thisFunction has return type string.

function thisFunction() { 
return "hello"; 
}

Usage

• The compiler is built in TypeScript, and is available as a JS file (tsc.js).

• The compiler ‘file I/O’ supports Node and Windows Scripting Host file APIs.

• If the server uses Node.js:

node path/to/tsc.js thisFile1.ts thisFile2.ts

• Commands run without any input filenames to see the command-line help for tsc.js.

• TypeScript does not provide a runtime.

• It needs a module loader, such as requirejs.

• A TypeScript module can either be generated to CommonJS convention (for use with node.js) or AMD convention (as used in requirejs); which it generates is a compiler switch.

Notes

TypeScript can be installed as an extension to Visual Studio.

Thus, basic running is as follows

Run the downloaded dot-VSIX file in the TypeScript SDK folder (for completing the installation).

Check the Tools/Extensions for TypeScript

Use Internet Explorer as the default

Use the TypeScript project in the C# new project category

Build, start Debugging, stop Debugging

The dot-js file will be in the (solution explorer) drop down category list position

Resources

This article is studying and paraphrasing on http://channel9.msdn.com/posts/Anders-Hejlsberg-Introducing-TypeScript and can be altered for lesson purposes. Documentation is available at TypeScript Language Specification.pdf

• http://blogs.msdn.com/b/somasegar/archive/2012/10/01/typescript-javascript-development-at-application-scale.aspx
• http://blogs.msdn.com/b/timart/archive/2012/10/02/typescript-project-in-visual-studio-2012.aspx
• http://arstechnica.com/information-technology/2012/10/microsoft-typescript-the-javascript-we-need-or-a-solution-looking-for-a-problem/