Readonly properties Some properties should only be modifiable when an object is first created. You can specify this by putting readonly before the name of the property: interface Point { readonly x: number; readonly y: number; } You can construct a Point by assigning an object literal. After the assignment, x and y can’t be changed. let p1: Point = { x: 10, y: 20 }; p1.x = 5; // error! TypeScript comes with a ReadonlyArray<T> type that is the same as Array<T> with all mutating

User-Defined Type Guards Notice that we had to use type assertions several times. It would be much better if once we performed the check, we could know the type of pet within each branch. It just so happens that TypeScript has something called a type guard. A type guard is some expression that performs a runtime check that guarantees the type in some scope. To define a type guard, we simply need to define a function whose return type is a type predicate: function isFish(pet: Fish | Bird): pet i

Extending Interfaces Like classes, interfaces can extend each other. This allows you to copy the members of one interface into another, which gives you more flexibility in how you separate your interfaces into reusable components. interface Shape { color: string; } interface Square extends Shape { sideLength: number; } let square = <Square>{}; square.color = "blue"; square.sideLength = 10; An interface can extend multiple interfaces, creating a combination of all of the interfaces.

Null and Undefined In TypeScript, both undefined and null actually have their own types named undefined and null respectively. Much like void, they’re not extremely useful on their own: // Not much else we can assign to these variables! let u: undefined = undefined; let n: null = null; By default null and undefined are subtypes of all other types. That means you can assign null and undefined to something like number. However, when using the --strictNullChecks flag, null and undefined are only

Generic Classes A generic class has a similar shape to a generic interface. Generic classes have a generic type parameter list in angle brackets (<>) following the name of the class. class GenericNumber<T> { zeroValue: T; add: (x: T, y: T) => T; } let myGenericNumber = new GenericNumber<number>(); myGenericNumber.zeroValue = 0; myGenericNumber.add = function(x, y) { return x + y; }; This is a pretty literal use of the GenericNumber class, but you may have noticed that

/// <reference path="..." /> The /// <reference path="..." /> directive is the most common of this group. It serves as a declaration of dependency between files. Triple-slash references instruct the compiler to include additional files in the compilation process. They also serve as a method to order the output when using --out or --outFile. Files are emitted to the output file location in the same order as the input after preprocessing pass.

Using Namespaces Namespaces are simply named JavaScript objects in the global namespace. This makes namespaces a very simple construct to use. They can span multiple files, and can be concatenated using --outFile. Namespaces can be a good way to structure your code in a Web Application, with all dependencies included as <script> tags in your HTML page. Just like all global namespace pollution, it can be hard to identify component dependencies, especially in a large application.

ES6 Modules TypeScript 1.5 supports ECMAScript 6 (ES6) modules. ES6 modules are effectively TypeScript external modules with a new syntax: ES6 modules are separately loaded source files that possibly import other modules and provide a number of externally accessible exports. ES6 modules feature several new export and import declarations. It is recommended that TypeScript libraries and applications be updated to use the new syntax, but this is not a requirement. The new ES6 module syntax coexist

// Type definitions for [~THE LIBRARY NAME~] [~OPTIONAL VERSION NUMBER~] // Project: [~THE PROJECT NAME~] // Definitions by: [~YOUR NAME~] <[~A URL FOR YOU~]> /*~ This template shows how to write a global plugin. */ /*~ Write a declaration for the original type and add new members. *~ For example, this adds a 'toBinaryString' method with to overloads to *~ the built-in number type. */ interface Number { toBinaryString(opts?: MyLibrary.BinaryFormatOptions): string; toBinaryString(

Type Guards and Differentiating Types Union types are useful for modeling situations when values can overlap in the types they can take on. What happens when we need to know specifically whether we have a Fish? A common idiom in JavaScript to differentiate between two possible values is to check for the presence of a member. As we mentioned, you can only access members that are guaranteed to be in all the constituents of a union type. let pet = getSmallPet(); // Each of these property accesses