TYPESCRIPTLarry Nung

AGENDAIntroductionInstallionTypesConstFunctionClassGenericsInterfaceReferenceQ & A

INTRODUCTION

INTRODUCTION

INSTALL

INSTALL Visual Studio 2013

TypeScript 1.5 for Visual Studio 2013   Visual Studio 2015

Pre-installed NPM

npm install -g typescript

TYPES

TYPES

Types

Boolean

Number

String

ArrayEnum

Any

Void

TYPES var variableName: Type;

var booleanVariable: boolean; var variableName: number; var variableName: string; var variableName: number[]; var variableName: Array<number>; var variableName: any;

function functionName(): void {…}

TYPES enum enumName{element1 = 1, element2,

element3}; var enumValue: enumName = enumName.

element1; var enumName: enumName = enumName[2];

TYPESenum Color {Red, Green, Blue};

var name:string = Color[2]; var value:number = Color.Green;

alert(name); alert(value);

CONST

CONSTconst buffer:number = 512;

FUNCTION

FUNCTIONfunction add(x: number, y: number):

number { return x+y;

}

var myAdd = function(x: number, y: number): number { return x+y; };

OPTIONAL PARAMETERSfunction buildName(firstName: string, lastName?:

string) { if (lastName) return firstName + " " + lastName; else return firstName;

}

var result1 = buildName("Bob"); //works correctly now var result2 = buildName("Bob", "Adams", "Sr.");

//error, too many parameters var result3 = buildName("Bob", "Adams"); //ah, just

right

DEFAULT PARAMETERSfunction buildName(firstName: string,

lastName = "Smith") { return firstName + " " + lastName;

}

var result1 = buildName("Bob"); //works correctly now, also

var result2 = buildName("Bob", "Adams", "Sr."); //error, too many parameters

var result3 = buildName("Bob", "Adams"); //ah, just right

REST PARAMETERSfunction buildName(firstName:

string, ...restOfName: string[]) { return firstName + " " + restOfName.join(" ");

} var buildNameFun: (fname: string, ...rest:

string[])=>string = buildName;

LAMBDAvar add = (x, y) => x+y; alert(add(10, 5));

CLASS

CLASSclass Person {

name: string; age: number; constructor(name: string, age:number) { this.name = name; this.age = age; } SayHello():string { return "Hello~I'm " + this.name; }

} var p = new Person("Larry Nung", 35); alert(p.SayHello());

CLASSclass Person {

private _name: string; private _age: number;

get name():string{ return this._name; } set name(value:string){ this._name = value; } get age():number{ return this._age; } set age(value:number){ this._age = value; }

constructor(name: string, age:number) { this.name = name; this.age = age; } SayHello():string { return "Hello~I'm " + this.name; }

} var p = new Person("Larry Nung", 35); alert(p.SayHello());

CLASSclass Person {

name: string; age: number; constructor(name: string, age:number) {this.name = name; this.age = age; } SayHello():string { return "Hello~I'm " + this.name; }

} class Larry extends Person {

constructor() { super("Larry Nung", 35); }

} var p = new Larry(); alert(p.SayHello());

GENERICS

GENERICSfunction ShowMessage<T>(message:T) {

alert(message); }

ShowMessage<string>("test"); ShowMessage<number>(123);

INTERFACE

INTERFACEinterface IHelloable {

enableIntroduce: boolean; SayHello():string;

} class Person implements IHelloable {

enableIntroduce: boolean; private name:string; constructor(name:string, enableIntroduce:boolean) { this.name = name; this.enableIntroduce = enableIntroduce; } SayHello():string { if(this.enableIntroduce) return "Hello~I'm " + this.name; else return "Hello"; }

} var p = new Person("LarryNung", false); alert(p.SayHello());

REFERENCE

REFERENCE Welcome to TypeScript

http://www.typescriptlang.org/ TypeScript - 維基百科，自由的百科全書

https://zh.wikipedia.org/wiki/TypeScript TypeScript - Wikipedia, the free encyclopedia

https://en.wikipedia.org/wiki/TypeScript

Q&A30

QUESTION & ANSWER

31