TypeScript基本概念

OGeek|极客世界-中国程序员成长平台 › 门户 › 编程› TypeScript›TypeScript教程

原作者: [db:作者] 来自: [db:来源] 收藏邀请

1. 基础类型

有12种

布尔值 let isDone: boolean = false;

数字 let dec: number = 6;

字符串 let name : string = 'bob';

数组 let list: number[] = [1, 2, 3];

元组 let x : [string, number] = ['hello', 10]

枚举 enum Color {Red, Green, Blue} let c: Color = Color.Green;

Any let notSure: any = 4;

Void function warnUser(): void { console.log('this is no return value') }

Null/Undefined 对应于js中的null和undefined

Never 表示那些永不存在的值的类型

Object 对象类型

类型断言强制类型转换 <string>someValue 或者 someValue as string

2. 接口

接口类似于一个结构体，可以用来定义对象的属性类型，函数类型，类类型等。

interface SquareConfig {
    color?: string;
    width?: number;
}

interface SearchFunc {
    (source: stirng,subString: string): boolean;
}

2.1 接口继承

接口可以多继承

interface Shape {
    color: string;
}

interface PenStroke {
    penWidth: number;
}

interface Square extends Shape, PenStroke {
    sideLength: number;
}

let square = <Square>{};
square.color = "blue";
square.sideLength = 10;
square.penWidth = 5.0;

2.2 混合类型

一个类型可以既是函数，又是对象，掺杂类型。

interface Counter{
    (start: number): string;
    interval: number;
    reset(): void;
}

function getCounter(): Counter {
    let counter = <Counter>function(start: number){ };
    counter.interval = 123;
    counter.reset = function(){};
    return counter;
}

let c = getCounter();
c(10);
c.reset();
c.interval = 5.0;

2.3 接口继承类

接口继承了一个类，只会继承该类的成员，但不会继承其实现。可以继承到该类的 private 和 protected 成员。

3. 类

与ES6的类相同，有一些额外的支持

3.1 成员修饰符(公有，私有和受保护)

private，protected，public

class Person {
    protected name: string;
    constructor(name: string) { this.name = name; }
}

class Employee extends Person {
    private department: string;

    constructor(name: string, department: string) {
        super(name)
        this.department = department;
    }

    public getElevatorPitch() {
        return `Hello, my name is ${this.name} and I work in ${this.department}.`;
    }
}

3.2 只读 readonly

class Octopus {
    readonly name: string;
    readonly numberOfLegs: number = 8;
    constructor (theName: string) {
        this.name = theName;
    }
}

3.3 抽象类

abstract class Animal {
    abstract makeSound(): void;
    move(): void {
        console.log('roaming the earch...');
    }
}

4. 函数

与ES6函数不同点有：

4.1 函数声明参数和返回值都带类型

function add(x: number, y: number): number {
    return x + y;
}

4.2 支持函数重载

function pickCard(x: {suit: string; card: number; }[]): number;

function pickCard(x: number): {suit: string; card: number; };

5. 泛型

用类型变量来约束类中的成员变量的各种类型，包括属性类型，方法参数类型和返回值类型

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; };

7. 高级类型

7.1 交叉类型

多个类型合并为一个类型，合成类型，包含了所有类型的特性。效果如：Person & Serializable & Loggable

7.2 联合类型

可以是多个类型中的任何一个类型，例如：number | string | boolean 表示一个值可以是 number， string，或 boolean。

若值是联合类型，只能访问联合类型所有类型里共有的成员。

interface Bird {
    fly();
    layEggs();
}

interface Fish {
    swim();
    layEggs();
}

function getSmallPet(): Fish | Bird {
    // ...
}

let pet = getSmallPet();
pet.layEggs(); // okay
pet.swim();    // errors

7.5 可为null类型

就是C#中的可空类型，b可以为null

class C {
    a: number;
    b?: number;
}

7.4 类型别名

类型别名就是给类型起一个新名字。别名不会创建新类型，只是引用了原来那个类型。

type Name = string;
type NameResolver = () => string;
type NameOrResolver = Name | NameResolver;

type Tree<T> = {
    value: T;
    left: Tree<T>;
    right: Tree<T>;
}

8. 命名空间

同C#命名空间