TS学习笔记二

TS学习笔记二

项目https://gitee.com/hucongcong/geek-pc-hz21/tree/master

1、类型保护

联合类型，类型保护，类型断言

interface Bird {
  fly: boolean;
  sing: () => {};
}
interface Dog {
  fly: boolean;
  bark: () => {};
}
// |联合类型，可以使bird也可以是dog
// 类型断言的方式实现类型保护
function trainAnimal(animal: Bird | Dog) {
  // if else实现类型保护
  if (animal.fly) {
    // 类型断言：强制animal就是bird
    (animal as Bird).sing();
  } else {
    (animal as Dog).bark();
  }
}
// in语法实现类型保护
function trainAnimalSecond(animal: Bird | Dog) {
  if ('sing' in animal) {
    animal.sing();
  } else {
    animal.bark();
  }
}
// typeof语法来实现类型保护
function add(first: string | number, second: string | number) {
  if (typeof first === 'string' || typeof second === 'string') {
    return `${first}${second}`;
  }
  return first + second;
}
// 使用instanceof语法来做类型保护，类才具备instanceof操作符
class NumberObj {
  count: number;
}
function addSecond(first: object | NumberObj, second: object | NumberObj) {
  if (first instanceof NumberObj && second instanceof NumberObj) {
    return first.count + second.count;
  }
  return 0;
}

2、枚举类型Enum

// 定义enum，后面的值自动增加，默认从0开始
enum Status {
  OFFLINE = 1,
  ONLINE,
  DELETED,
}
// 反向查询，枚举类型名称
console.log(Status.OFFLINE, Status[0]);


function getResult(status) {
  if (status === Status.OFFLINE) {
    return 'offline';
  } else if (status === Status.ONLINE) {
    return 'online';
  } else if (status === Status.DELETED) {
    return 'deleted';
  }
  return 'error';
}

const result = getResult(1);
console.log(result);

3、泛型

函数中使用泛型

泛指的类型：定义函数添加泛型，在使用方法的时候指定具体的类型(在使用的时候才知道具体是什么类型)

一般用T来做泛型的简写，支持类型推断

可以定义多个泛型，在使用的时候也需要对应定义对个泛型

// 泛型 generic 泛指的类型

function join<T, P>(first: T, second: P) {
  return `${first}${second}`;
}

function anotherJoin<T>(first: T, second: T): T {
  return first;
}

// T[]
function map<T>(params: Array<T>) {
  return params;
}

// join<number, string>(1, '1');
// map<string>(['123']);
join(1, '1');

类中使用泛型