猫哥

vuePress-theme-reco 猫哥    2017 - 2025
猫哥 猫哥
主页
博客
  • 杂谈游记
  • 技术笔记
  • 前端技术
  • 前端
  • 杂物收纳
标签
时间轴
关于
author-avatar

猫哥

35

文章

32

标签

主页
博客
  • 杂谈游记
  • 技术笔记
  • 前端技术
  • 前端
  • 杂物收纳
标签
时间轴
关于

TypeScript 高级类型实战

vuePress-theme-reco 猫哥    2017 - 2025

TypeScript 高级类型实战

猫哥 2021-11-05 TypeScript前端

探索 TypeScript 中的高级类型用法,提升代码类型安全性。

# 1. 泛型工具类型

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

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

# 2. 条件类型

type IsString<T> = T extends string ? true : false

// 使用示例
type A = IsString<string> // true
type B = IsString<number> // false

# 3. 映射类型

type Readonly<T> = {
  readonly [P in keyof T]: T[P]
}

interface User {
  name: string
  age: number
}

type ReadonlyUser = Readonly<User>

# 4. 联合和交叉类型

type StringOrNumber = string | number
type NameAndAge = { name: string } & { age: number }