使用方式

let is_valid:boolean
is_valid = ture;    // 正确使用
is_valid = 'abc';   // 报错，因为is_valid指定布尔型，但'abc'是字符串类型

所有类型

布尔

let is_valid:boolean = true;

数字 1. 所有数字都是浮点数；2.支持10进制，16进制，2进制，8进制

let age:number = 18;

字符串

let name:string = 'WJ';
let name :string = 'My name is ' + user.name;
let name:string = `My name is ${user.name}`;

数组 number[]; Array<number>;

let list:number[] = [1,2,3]
let list:Array<object> = [ {id:1}, {id:2} ]; 

只读数组ReadonlyArray<number>创建不能修改

let list:ReadonlyArray<number> = [3,5,2];  
let list2 : number[];
list[0] = 4;               // 错误
list2 = list;              // 错误
list2 = list as number[];  // 正确：利用断言as重写

对象非原生类型，无法像其他类型一样声明类型

let obj:any = {}
let {a,b}:{a:number, b:string} = {a:18, b:'WJ'}

函数 非原生类型

let func:()=>void;

元祖 特殊数组：固定长度与每个元素类型

let tuple:[string, number] = ['WJ',18];            // 正确
let tuple:[string, number] = [false,18];           // 错误，类型不一致
let tuple:[string, number] = ['WJ',18,'female'];   // 错误，长度不一致
let tuple:[string, number] = ['WJ'];               // 错误，长度不一致

枚举

// 定义枚举： enum 枚举名 { 字符串名=编号 }
enum Color1 {Red, Green, Blue};
enum Color2 {Red, Green=3, Blue, Yellow=8};  // 手动指定编号，编号3前以0开始计算，编号3后，从编号3开始计算
enum Color3 {Red='#FF0000', Green='00FF00', Blue='0000FF' };

// 获取枚举值的编号
Color1.Green;    // 输出1； 编号从0开始计算
Color2.Green;    // 输出3; 
Color3.Green;    // 输出#00FF00

// 获取枚举值的字符串名
Color1[1];       // 输出'Red'

Any 允许任何类型

let data:any = 'WJ'  // 声明Any类型
data = 18;           // 正确
data = false;        // 正确
data.getList();      // 正确；编译时不会坚持getList是否存在，但是运行时因为不存在getList而报错

Void用来强制函数返回null或undefined

// 正确的，getList的return值是undefined
function getList():void{
    console.log(1)
}
// 错误的，因为return的值不是null或undefined
function getList():void{
    return 'abc'
}

Null / Undefined

let u :undefined = undefined;
let n :null = null;

// `不赞成`若不是strictNullChecks模式，null和undefined可复制给任意类型的变量 
let age:number = 18;
let n:null =null;
age = n; // 输出：age===null

Never 表示函数无法正常执行完成，中途必定报错

function err(msg:string):never{ throw new Error(msg); }
function fail(){ return err('some fail'); }
function fn():never{
    while (true){}
}

断言coder自信确认类型，无需ts检查

let fullname = 'WJ'
// 写法一（建议这种写法）
let length:number = (fullname as string).length;
// 写法二（JSX不支持此写法）
let length:number = (<string>fullname).length

泛型

交叉类型

把多种类型叠加成一种类型

let object_1 = {
    name: 'WJ',
    age:18
}
let object_2 = {
    hello:'Hello WJ',
    sayHello(){
        console.log(this.hello)
    }
}

// 将object_1与object_2合并，生成的对象拥有两者的所有类型
function merge_object<T, U>(first: T, second: U): T & U {
    let result = <T&U>{}
    result = {...(object_1 as any), ...object_2}
    return result;
};

// result: {name, age, hello, sayHello}
let result = merge_object(object_1, object_2);
result.sayHello();

联合类型

参数有指定的几种类型

function func(x:number | string) {
    let RESULT_PRE = {
        number:'age is ',
        string:'name is ',
    }
    let type:string = typeof x;
    let result: string = RESULT_PRE[type] ? RESULT_PRE[type] + x : 'who are you';
    return result;
}

func(18);    // 输出： age is 18
func('WJ');  // 输出：name is WJ
func({});    // 输出：who are you

联合类型是接口，只能访问接口中共有部分

interface car {
    buy();
    drive();
}

interface house {
    buy();
    sleep();
}

let x:car | house
x.buy();      // 正确
x.drive();    // 错误
x.sleep();  // 错误

类型保护与区分类型 param_name is type_name

示例

function isNumber(x:any): x is number{
    return typeof x === 'number'
}
function func(x:any){
    let result;
    if(isNumber(x)){
        result = x+1;
    }
    return result;
}

应用

interface car {
    buy();
    drive();
}

interface house {
    buy(),
    sleep();
}


function func(): car | house {
    let result:car;
    result.buy = ()=>{}
    result.drive = ()=>{}
    return result;
}

let tool = func();

// 正确：因为buy是car和house共有
if(tool.buy){
   tool.buy();
}

// 错误：因为drive只属于car，不属于house，tool只能使用共有
if(tool.drive){  
   .drive();
}

// 用来判断当前对象是car
function isCar(x:car | house): x is car {
    return (x as car).drive !== undefined
}
// 正确
if(isCar(tool)){
    tool.drive();
}

类型别名

type name = string;
type name_creator = ()=>string;
type name_type = name | name_creator

function getName( n: name_type): name{
    return typeof n === "string" ? n : n();
}

泛型别名

type as_name<T> = {x:T}

type as_name<T> = {
    x: T;
    y:as_name<T>
}

多态的this类型

通过return this，实现链式调用

class PERSON {
    constructor(public name:string){}

    getName(){return this.name;}

    setName(name){
        this.name = name;
        return this;
    }
}

let wj = new PERSON('WJ');
wj.setName('WanJin').getName();  // 因为setName方法return this，所有调用完成后，可接着调用getName

索引类型

// keyof T : 由T的key组成的数组
// T[key] : T的一个属性值
function func<T, K extends keyof T>(array:T, keys:K[]):T[K][] {
    return keys.map(key=>array[key])
}

let person = {
    name:'WJ',
    age:18,
    sex:'male'
}

func(person, ['name','age']);       // ['WJ',18]

映射类型