typescript常用知识

常用ts用法

enum

枚举值可以用enum声明类型

enum E_SEX {
  MALE = '男',
  FEMALE = '女',
}

interface

接口是一系列抽象方法的声明

也可用于对象的类型声明

1
2
3

interface IProps {
  value: string;
}

可选值

1
2
3

interface IProps {
  value?: string;
}

value属性是可选的，值可以是空对象

1	const props: IProps = {};

联合类型

可以通过管道(|)将变量设置为联合类型

value的类型可以是string或者number

1	const value: string \| number = 1;

type

1 2	type TName = number; const value: TName = 1;

补充：typescript 中的 interface 和 type 到底有什么区别？

数组

两种声明都可以

1
2
3

const list: number[] = [];
// 或
const list: Array<number> = [];

函数

1
2
3

function f(value: number): number {
  return 1;
}

extends

继承

interface IProps {
  value: number;
}

interface IChildProps extends IProps {
  childValue: number;
}

&

交叉类型

interface IProps1 {
  value1: number;
}

interface IProps2 {
  value2: number;
}

const props: IProps1 & IProps2 = {
  value1: 1,
  value2: 2
};

namespace

命名空间可以解决重名问题

namespace NameSpace {
  export interface IProps {
    value: number;
  }
}

元组

用来表示已知元素数量和类型的数组。

1	const list: [string, number] = ['1', 1];

never 类型

never是其它类型（包括null和undefined）的子类型，代表从不会出现的值。

这意味着声明为never类型的变量只能被never类型所赋值，在函数中它通常表现为抛出异常或无法执行到终止点（例如无限循环）

let x: never;

// 运行正确，never 类型可以赋值给 never类型
x = (()=>{ throw new Error('exception')})();

// 返回值为 never 的函数可以是抛出异常的情况
function error(message: string): never {
    throw new Error(message);
}

// 返回值为 never 的函数可以是无法被执行到的终止点的情况
function loop(): never {
    while (true) {}
}

泛型

interface IProps<T> {
  value: T;
}

const props: IProps<number> = {
  value: 1
};

Omit<T, K>

Omit<T, K>类型让我们可以从对象类型中剔除某些属性，从而创建新的对象类型。

interface IProps {
  value: number;
  value1: number;
}

type TProps = Omit<IProps, "value1">;

const props: TProps = {
  value: 1
};

声明文件

1
2
3

declare const jQuery: (selector: string) => any;

jQuery('div');

在React中使用TypeScript

这篇文章总结得不错：