Skip to content

TypeScript

type 和 interface

相同点

都能继承

ts
// extends
interface Parent {
  name: string
  age: number
}

interface Child extends Parent {
  family: string
}

type Parent = {
  name: string
  age: number
}
type Child = Parent & { family: string }

不同点

type

ts
// 声明更多变
type Name = string

interface Dog {
  wong()
}

interface Cat {
  miao()
}

type Pet = Cat | Dog
// 具体定义数组每个位置的类型
type Animals = [Dog, Pet]

// 能直接获取类型
type B = typeof div

interface 声明能进行合并

ts
interface User {
  name: string
  age: number
}

interface User {
  sex: string
}

readonly

Readonly 与 readonly

ts
type Asd = Readonly<{
  name: string
  obj: {
    name: string
  }
}>
// 等同于
interface Asd {
  readonly name: string
  readonly obj: {
    name: string
  }
}

与 const 对比

与 const 类似,也是无法改变内存地址指向,地址内的数据仍可修改
const 在运行时检查, readonly 在编译时检查
class 中只能使用 readonly

枚举

ts
enum MyEnums {
  No = 0,
  Yes,
  Red = "red",
  Blue = "blue",
}
console.log(MyEnums.No)
console.log(MyEnums.Yes)
console.log(MyEnums.Red)
console.log(MyEnums.Blue)
// js
var MyEnums
;(function (MyEnums) {
  MyEnums[(MyEnums["No"] = 0)] = "No"
  MyEnums[(MyEnums["Yes"] = 1)] = "Yes"
  MyEnums["Red"] = "red"
  MyEnums["Blue"] = "blue"
})(MyEnums || (MyEnums = {}))
console.log(MyEnums.No)
console.log(MyEnums.Yes)
console.log(MyEnums.Red)
console.log(MyEnums.Blue)

MyEnums["No"] = 0,MyEnums[0] = "No",不仅能 key 映射 value,也能从 value 映射 key,这就是数字枚举支持反向映射的原理。

const enum 在编译为 js 时会内联抹除掉枚举对象,直接内联编译为对应的值

ts
const enum MyConstEnums {
  No = 0,
  Yes,
  Red = "red",
  Blue = "blue",
}
console.log(MyConstEnums.No)
console.log(MyConstEnums.Yes)
console.log(MyConstEnums.Red)
console.log(MyConstEnums.Blue)
// js
console.log(0 /* MyConstEnums.No */)
console.log(1 /* MyConstEnums.Yes */)
console.log("red" /* MyConstEnums.Red */)
console.log("blue" /* MyConstEnums.Blue */)

declare 一般在 .d.ts 文件中使用,在编译为 js 时会完全抹除

泛型

ts
type Pick<T, K extends keyof T> = { [P in K]: T[P] }

type Record<K extends keyof any, T> = { [P in K]: T }

type Partial<T> = { [P in keyof T]?: T[P] }

type Exclude<T, U> = T extends U ? never : T

type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>