TypeScript is a language for application-scale JavaScript development. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. Any browser. Any host. Any OS. Open Source.
TypeScript is a superset of JavaScript that combines type checking and static analysis, explicit interfaces, and best practices into a single language and compiler. By building on JavaScript, TypeScript keeps you close to the runtime you’re targeting while adding only the syntactic sugar necessary to support large applications and large teams.
TypeScript starts from the syntax and semantics that JavaScript developers know today. With TypeScript, you can use existing JavaScript code, incorporate popular JavaScript libraries, and be called from other JavaScript code.
TypeScript compiles to clean, simple JavaScript code which runs on any browser, in Node.js, or in any other ES3-compatible environment.
The latest version of TypeScript includes of new features in the language, compiler and associated tools. And it comes in the box as part of Visual Studio 2013 and Visual Studio 2015.
JavaScript Code is TypeScript
JavaScript code you’ve developed can easily be brought into the TypeScript world – all JavaScript code is already TypeScript code.
Here’s some JavaScript code that works great with TypeScript. Can you spot the bug?
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function Greeter(greeting) { | |
this.greeting = greeting; | |
} | |
Greeter.prototype.greet = function() { | |
return "Hello " + this.greeting; | |
}; | |
var greeter = new Greeter( { | |
message: "world" | |
}); | |
var button = document.createElement('button'); | |
button.innerText= "Say Hello"; | |
button.onClick = function() { | |
alert(greeter.greet()); | |
}; | |
document.body.appendChild(button); |
Until you get this:
With TypeScript, I can add a simple inline type annotation to the Greeter function’s parameter.
function Greeter(greeting : string) { this.greeting = greeting; }
You will receive an error when the compiler gets to the function that was counting on you sending in a string.
The type system for TypeScript is lightweight. It does not force you to add type annotations to all of a project when porting from JavaScript. Instead, types are optional, and you can add type annotations to gradually improve tooling and error detection. In many cases, the TypeScript compiler will even infer types,
Class Declarations, Modules
TypeScript includes a type declaration syntax, which aligns with the class proposal in the emerging ECMAScript 6 standard.
With TypeScript, JavaScript programmers will have now have easy access to Interfaces to describe requirements, Inheritance to share functionality, and Modules to group related code into namespaces.
Modules in TypeScript align with an emerging proposal from ECMAScript 6. TypeScript supports targeting popular module loading specifications, including CommonJS and AMD in any ECMAScript 3-compatible environment. The TypeScript compiler supports generating AMD from TypeScript modules, giving websites the potential to scale to large application sizes.
Tooling
Along with the TypeScript language and compiler, we are also announcing the TypeScript for Visual Studio 2012 plugin, which extends Visual Studio with a full developer experience including code navigation, refactoring, static error messages, and IntelliSense:
Generics
Generics enable capturing relationships between inputs and outputs in APIs, enabling richer type checking for better error reporting and tools. For example, generics allow the typing of the Array#map function from JavaScript to relate the element type of the array with the parameter to the callback function (‘T’ below), and the return type of the callback function with the return type of ‘map’ (‘U’ below).
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
interface Array<T> { | |
// … | |
map<U>(callbackfn: (value: T, index: number, array: T[]) => U): U[]; | |
// … | |
} | |
var array: Array<string> = ["John", "Sam", "George"]; | |
var lengths = array.map((val, idx, arr) => val.length); |
Exporting for AMD
TypeScript has built-in language support for external module loaders like CommonJS and AMD, which enables TypeScript to be used in environments like Node.js on the desktop and with libraries like require.js in the browser. Both of these module systems provide the ability to provide an explicit value for the module.
In the following example, a ‘Client’ class may be set as the exported value from a module, allowing the ‘import’ to directly import the class.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// app.ts | |
import MyClient = require('./client'); | |
var myClient = new MyClient("Joe Smith", "My #1 client"); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// client.ts | |
class Client { | |
constructor(public name: string, public description: string) { } | |
} | |
export = Client; |
Open, Interoperable
You can literally copy-and-paste from an existing JavaScript program into a TypeScript file. You can also create TypeScript declare files to annotate the types for existing libraries, enabling great tooling experiences without having to modify the libraries themselves (Microsoft includes TypeScript files to declare the types for several popular JavaScript libraries like jQuery, MongoDB, and the DOM).
The TypeScript language is made available under the Open Web Foundation’s Final Specification Agreement (OWFa 1.0), and we invite the community to discuss the language specification. Microsoft’s implementation of the compiler is also available on CodePlex (with git) under the Apache 2.0 license.
How to Get TypeScript
Visual Studio includes TypeScript in the box, starting with Visual Studio 2013 Update 2. You can also edit TypeScript in WebStorm, Eclipse, and other editors.
The command-line TypeScript compiler can be installed as a Node.js package.
See TypeScript home page for mre details
Source Code
TypeScript is being developed on GitHub. The TypeScript compiler is implemented in TypeScript, and can be used in any JavaScript host.
Specification
Read the specification in doc or pdf
Tutorial
A TypeScript tutorial gives you a quick start in using TypeScript and in its features. In addition, you can try out the features in a playground that shows you TypeScript and JavaScript side by side.