TypeScript 的类型系统是其最强大的特性之一。本文将深入讲解 TypeScript 高级类型编程,包括泛型、条件类型、模板字面量类型等核心概念。
泛型(Generics)
泛型允许我们在定义函数、接口或类时不预先指定具体类型,而是在使用时再指定:
function identity<T>(arg: T): T {
return arg
}
const result = identity<string>('hello') // 显式指定
const result2 = identity(42) // 类型推断
泛型约束
interface Lengthwise {
length: number
}
function loggingIdentity<T extends Lengthwise>(arg: T): T {
console.log(arg.length)
return arg
}
条件类型(Conditional Types)
type IsString<T> = T extends string ? true : false
type A = IsString<'hello'> // true
type B = IsString<123> // false
实用条件类型工具
type NonNullable = T extends null | undefined ? never : T
type ReturnType = T extends (...args: any[]) => infer R ? R : never
type Parameters = T extends (...args: infer P) => any ? P : never
映射类型(Mapped Types)
type Readonly<T> = {
readonly [P in keyof T]: T[P]
}
type Optional<T> = {
[P in keyof T]?: T[P]
}
interface User {
name: string
age: number
}
type ReadonlyUser = Readonly<User>
模板字面量类型(Template Literal Types)
type EventName<T extends string> = `on${Capitalize<T>}`
type ClickEvent = EventName<'click'> // 'onClick'
type HoverEvent = EventName<'hover'> // 'onHover'
工具类型
Partial<T>- 所有属性可选Required<T>- 所有属性必填Pick<T, K>- 选择部分属性Omit<T, K>- 排除部分属性Record<K, T>- 创建对象类型Exclude<T, U>- 排除联合类型中的某些类型Extract<T, U>- 提取联合类型中的某些类型
实战示例
实现一个 API 响应的类型:
interface ApiResponse<T> {
code: number
message: string
data: T
}
type ApiSuccess<T> = ApiResponse<T> & { code: 0 }
type ApiError = ApiResponse<null> & { code: number }
type ApiResult<T> = ApiSuccess<T> | ApiError
总结
TypeScript 高级类型是构建大型应用的关键技能。掌握这些类型技巧可以大幅提升代码的可维护性和开发效率。