Using a class as an interface

Using a class as an interface As we said in the previous section, a class declaration creates two things: a type representing instances of the class and a constructor function. Because classes create types, you can use them in the same places you would be able to use interfaces. class Point { x: number; y: number; } interface Point3d extends Point { z: number; } let point3d: Point3d = {x: 1, y: 2, z: 3};

hasInstance

Symbol.hasInstance A method that determines if a constructor object recognizes an object as one of the constructor’s instances. Called by the semantics of the instanceof operator.

Add TypeScript code

Add TypeScript code Right click on scripts and click New Item. Then choose TypeScript File (it may be in the .NET Core section) and name the file app.ts.

TypeScriptCompileBlocked

TypeScriptCompileBlocked If you are using a different build tool to build your project (e.g. gulp, grunt , etc.) and VS for the development and debugging experience, set <TypeScriptCompileBlocked>true</TypeScriptCompileBlocked> in your project. This should give you all the editing support, but not the build when you hit F5.

Optional Properties

Optional Properties Not all properties of an interface may be required. Some exist under certain conditions or may not be there at all. These optional properties are popular when creating patterns like “option bags” where you pass an object to a function that only has a couple of properties filled in. Here’s an example of this pattern: interface SquareConfig { color?: string; width?: number; } function createSquare(config: SquareConfig): {color: string; area: number} { let newSquare = {c

Boolean

Boolean The most basic datatype is the simple true/false value, which JavaScript and TypeScript call a boolean value. let isDone: boolean = false;

Merging Namespaces with Classes

Merging Namespaces with Classes This gives the user a way of describing inner classes. class Album { label: Album.AlbumLabel; } namespace Album { export class AlbumLabel { } } The visibility rules for merged members is the same as described in the ‘Merging Namespaces’ section, so we must export the AlbumLabel class for the merged class to see it. The end result is a class managed inside of another class. You can also use namespaces to add more static members to an existing class. In additi

Overloads and Callbacks

Overloads and Callbacks Don’t write separate overloads that differ only on callback arity: /* WRONG */ declare function beforeAll(action: () => void, timeout?: number): void; declare function beforeAll(action: (done: DoneFn) => void, timeout?: number): void; Do write a single overload using the maximum arity: /* OK */ declare function beforeAll(action: (done: DoneFn) => void, timeout?: number): void; Why: It’s always legal for a callback to disregard a parameter, so there’s no need f

Test the resulting app

Test the resulting app gulp node dist/main.js The program should print “Hello from TypeScript!”.

Write a simple Angular app in TypeScript

Write a simple Angular app in TypeScript First, change the code in app.ts to: import {Component} from "angular2/core" import {MyModel} from "./model" @Component({ selector: `my-app`, template: `<div>Hello from </div>` }) class MyApp { model = new MyModel(); getCompiler() { return this.model.compiler; } } Then add another TypeScript file in src named model.ts: export class MyModel { compiler = "TypeScript"; } And then another TypeScript file in src named main.ts: i