介绍
这是一篇typescript的语法说明书, 欢送拜访我的博客
装置
npm install -g typescript tsc hello.ts 编译ts文件数据类型
// boolean: let isDone: boolean = false// number, string, void, null, undefined,any// union: let myFavoriateNumber: string | number// interfaces: 对行为的形象，而具体如何口头须要由类（classes）去实现（implement） interface: Person { name: string; age?: number; // age是可选属性, 用 ？示意可选 [propName: string]: any; // 容许有任意的属性 readonly id: number // 只读属性 }// array: let fibonacci: number[] = [1, 1, 2, 3, 5]函数
function buildName(firstName: string = 'cat', lastName?:string, ...items: any[]):string{ let r: number[] = [] items.forEach(item => r.push(item)) return lastName ? firstName + lastName : firstName}// 函数重载function reverse(x: number): number;function reverse(x: string): string;function reverse(x: number | string): number | string { if (typeof x === 'number') { return Number(x.toString().split('').reverse().join('')); } else if (typeof x === 'string') { return x.split('').reverse().join(''); }}类型断言
interface Cat { name: string; run(): void;}interface Fish { name: string; swim(): void;}function isFish(animal: Cat | Fish) { // 应用类型断言 "值 as" 的形式解决了联结类型变量只能拜访共有属性的问题 if(typeof (animal as Fish).swim === 'function') { return true; } return false;}(window as any).foo = 1申明与导出
// 申明全局变量declare var// 申明全局办法declare function// 申明全局类declare class// 申明全局枚举类型declare enum// 申明（含有子属性的）全局对象declare namespace// 申明全局类型interface 和 type// 导出变量export// 导出（含有子属性的）对象export namespace// ES6 默认导出export default// 导出模块export = commonjs// UMD 库申明全局变量export as namespace// 扩大全局变量declare global// 扩大模块declare module/// <reference /> 三斜线指令// 在引入内部文件的时候，比方jquery,因为ts中在编译过程的时候，须要每个变量进行定义declare var jQuery: (selector: string) => anydeclare namespace JQuery { function ajax(url: string, settings?: any): void}类型别名
type Name = stringtype NameResolver = () => stringtype NameOrResolver = Name | NameResolver字符串字面量类型
type EventNames = 'click' | 'scroll' | 'mousemove';function handleEvent(ele: Element, event: EventNames) { // do something}handleEvent(document.getElementById('hello'), 'scroll'); // 没问题handleEvent(document.getElementById('world'), 'dblclick'); // 报错，event 不能为 'dblclick'元祖
let tom: [string, number] = ['tom', 25]枚举
// 默认第一个是0，顺次递减少一enum Days {sun, mon, tue, wed, thr, fir, sat}enum Days {sun=7, mon=1, tue, wed, thr, fri, sat}类
// 抽象类的形象办法，继承的类要具体实现public, private, protect, static, readonly, abstract接口
// 接口能够继承接口// 一个类能够实现多个接口// 接口能够继承类interface Alarm { alert():void}class Door {}class SecurityDoor extends Door implements Alarm { alert() { console.log('securitydoor') }}泛型
// 在函数外部应用泛型变量的时候，因为当时不晓得它是哪种类型，所以不能随便的操作它的属性或办法// 然而能够通过束缚的方法解决这个问题interface Lengthwise { length: number;}function loggingIdentity<T extends Lengthwise>(arg: T): T { console.log(arg.length); return arg;}// 泛型的写法function createArray<T>(length: number, value: T):Array<T>{ let result: T[] = [] for (let i = 0; i < length; i++) { result[i] = value } return result}create<string>(3, 'x')// 多个类型参数function swap<T, U>(tuple: [T, U]): [U, T] { return [tuple[1], tuple[0]];}swap([7, 'seven']); // ['seven', 7]// 泛型接口nterface CreateArrayFunc<T> { (length: number, value: T): Array<T>;}let createArray: CreateArrayFunc<any>;createArray = function<T>(length: number, value: T): Array<T> { let result: T[] = []; for (let i = 0; i < length; i++) { result[i] = value; } return result;}createArray(3, 'x'); // ['x', 'x', 'x']// 泛型参数的默认类型function createArray<T = string>(length: number, value: T): Array<T> { let result: T[] = []; for (let i = 0; i < length; i++) { result[i] = value; } return result;}申明合并
// 函数的合并function reverse(x: number): number;function reverse(x: string): string;function reverse(x: number | string): number | string { if (typeof x === 'number') { return Number(x.toString().split('').reverse().join('')); } else if (typeof x === 'string') { return x.split('').reverse().join(''); }}接口的合并
interface Alarm { price: number;}interface Alarm { weight: number;}