typescript

基础类型

number、boolean、string、array、tuple、enum、any、void、null、undefined、never、object

泛型

索引类型

interface 和 type 的区别

1.都可以用来描述对象或函数的类型，但语法不同

1
2
3
4
5

interface SetPoint {
  (x: number, y: number): void;
}

type SetPoint = (x: number, y: number) => void;

2.type 类型别名还可以用于其他类型

1
2
3
4
5
6

//number
type MyNumber = number;

//dom
let div = document.createElement("div");
type MyDiv = typeof div;

3.extends 语法不同

  • interface extends interface 
    1
2
3
4
5
6

    interface PointX {
  x: number;
}
interface Point extends PointX {
  y: number;
}
  • interface extends type 
    1
2
3
4

    type PointX = { x: number };
interface Point extends PointX {
  y: number;
}
  • type extends type 
    1
2
3

    type PointX = { x: number };
type PointY = { y: number };
type Point = PointX & PointY;
  • type extends interface 
    1
2
3
4
5

    type PointX = { x: number };
interface PointY {
  x: number;
}
type Point = PointX & PointY;

4.interface 可以定义多次，并会合并多次，但 type 不可以

1
2
3
4
5
6
7
8

interface User {
  name: string;
}
interface User {
  password: string;
}

//此时User -> {name: string; password: string}

5.type 能使用 in 关键字生成映射类型，但 interface 不行

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20

type Status = 200 | 500;

type StatusMap = {
  [key in Status]: string;
};

const test: StatusMap = {
  200: "ok",
  500: "server error",
};

/**
  报错 
  接口中的计算属性名称必须引用必须引用类型为文本类型或 "unique symbol" 的表达式。
  计算属性名的类型必须为 "string"、"number"、"symbol" 或 "any"。
  “Status”仅表示类型，但在此处却作为值使用。
**/
// interface StatusMap2 {
//   [key in Status]: string
// }

6.默认导出方式不同

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

export default interface Person {
  name: string;
}

//会报错
// export default type Person = {
//   name: string
// }

type Person1 = {
  name: string;
};
export default Person1;

Redux