typescript

TypeScript

概述

TypeScript 是带有静态类型的 JavaScript。它增加了编译时类型检查器；运行时行为仍由 JavaScript 决定。学习 JavaScript 同样适用于 TypeScript 的运行时任务（例如，对列表排序、操作 DOM、处理异步）。使用 TypeScript 定义类型、接口、泛型，并获得更好的工具支持。

核心理念：类型用于描述结构和契约；编译器会在运行前捕获类型错误。最佳实践是在 tsconfig.json 中启用 strict。

---

快速参考

概念	语法／说明
类型注解	let x: string，function f(n: number): void
接口	interface User { name: string; id: number }
类型别名	type Id = string | number
联合类型	string 或 number（联合类型）
可选	prop?: string 或 prop: string | undefined
泛型	function id<T>(x: T): T { return x }
根据架构推断类型	使用库（例如 Zod：z.infer<typeof schema>）

---

常用类型

• 原始类型：string、number、boolean、bigint、symbol。
• 数组：number[] 或 Array<number>。
• Any：any——会禁用类型检查；尽可能避免使用。对于真正未知的数据，优先使用 unknown，并在使用前缩小类型范围。
• 类型注解（后置）：const name: string = "x"，function greet(name: string): string { return "Hi " + name }。
• 对象类型：{ name: string; age?: number } 或 interface User { name: string; age?: number }。
• 联合类型：string | number；字面量类型："a" | "b"。

---

类型缩窄

使用条件语句缩窄类型，让 TypeScript 能够进行推断：

• typeof：if (typeof x === "string") { ... }
• 真值判断：if (value) { ... }
• 相等判断：if (x === null) { ... }
• in：if ("name" in obj) { ... }
• 类型守卫：function isFish(pet: Fish | Bird): pet is Fish { ... }
• 可辨识联合类型：使用一个共有的字面量字段（例如 kind: "circle"），并通过 switch 语句进行判断。

---

函数

• 签名：(a: string, b?: number) => boolean；无返回值时使用 void。
• 重载：多个调用签名加一个实现。
• 泛型：function first<T>(arr: T[]): T \| undefined。
• 约束：function longest<T extends { length: number }>(a: T, b: T): T。

---

对象类型与类型操作

• 接口：interface Point { x: number; y: number }；使用 extends 进行扩展。
• 索引签名：[key: string]: number。
• keyof：type K = keyof User → 键的联合类型。
• typeof：type C = typeof config（值 → 类型）。
• 索引访问：type Name = User["name"]。
• 映射类型：type Readonly<T> = { readonly [K in keyof T]: T[K] }。
• 条件类型：type F = T extends string ? number : boolean。
• 模板字面量类型：type E = `on${Capitalize<Event>}`。
• 实用类型：Partial<T>、Required<T>、Pick<T, K>、Omit<T, K>、Record<K, V>、Exclude<T, U>、Extract<T, U>、NonNullable<T>、ReturnType<F>、Parameters<F>。

---

类

• 成员：class C { prop: number; method(): void {} }。
• 构造函数：constructor(public name: string) {}（参数属性）。
• 实现接口：class D implements I {}。
• 继承：class Child extends Parent {}。
• 根据需要使用 Readonly、private、protected。

---

模块

• ES 模块：import { x } from "./file"、export const x = 1、export type { T }。
• 默认导出：export default App、import App from "./App"。
• 命名空间（旧式）：优先使用 ES 模块。

---

项目配置：tsconfig.json

• strict：设置 "strict": true（推荐）。启用 strictNullChecks、noImplicitAny、strictFunctionTypes 等。
• target：例如 "ES2022" 或 "ESNext"。
• module：例如 "ESNext"，Node 环境下使用 "NodeNext"。
• moduleResolution：使用打包工具时设为 "bundler"，Node 环境下设为 "NodeNext"。
• paths：使用 "@/*": ["./src/*"] 设置路径别名。
• include / exclude：指定要编译的文件。
• References：大型单体仓库可使用项目引用。

参见 reference.md 中的官方 TSConfig Reference 链接。

---

最佳实践

• 启用 strict 模式。
• 对可能扩展的对象结构优先使用 interfaces；对联合类型、映射类型和别名优先使用 type。
• 尽可能使用 const 和 readonly。
• 对外部数据使用 unknown 而非 any；使用前先缩小类型范围。
• 使用 generics 编写可复用且类型安全的函数。
• 对运行时验证和类型检查，可使用架构库（例如 Zod），并通过 z.infer<typeof schema> 推导类型。

---

常见错误

• any：应避免使用；改用 unknown 并缩小类型范围，或使用合适的类型。
• 非空断言（!）：谨慎使用；优先缩小类型范围或使用可选链。
• 类型断言（as）：当数据来自外部时，优先使用类型守卫或架构验证。
• 关闭严格模式：保持 strict: true；修复错误，而不是禁用检查。

---

其他资源

• reference.md — 官方文档链接（Handbook、Reference、TSConfig、速查表）。
• 官方：https://www.typescriptlang.org/docs — 入门指南、Handbook、Reference、TSConfig。