TS 语法速查卡

TypeScript（TS）是 JavaScript 的大哥哥：它会检查代码里的类型，出错时提前大喊"这里不对！"。

这一页收集书里出现过的所有 TS 语法。看书时忘了哪个，就来这一页查。

速查卡会随书慢慢长大：每章出现新语法，这一页就会同步更新。

类型标注

给变量贴上"类型标签"：

let count: number = 1;      // 这是个数字
let name: string = '小铃';   // 这是文字
let ok: boolean = true;     // 这是"是/否"

读法：变量名: 类型。告诉电脑"这里只放这种数据"。

泛型 <T>

一种"类型占位符"：先不说是哪种类型，让使用者来定。

function signal<T>(initial: T) { /* ... */ }

const count = signal(1);   // T 是 number
const name = signal('铃');  // T 是 string

读法：<T> 像口袋——往里装什么类型都行，但装进去之后，袋子里就只认这一种。

接口 interface

给"一组数据长什么样"画一张图纸：

interface ReactiveNode {
  flags: number;
  deps?: Link;
}

const node: ReactiveNode = { flags: 0 };  // 必须符合图纸

读法：接口是图纸，对象是照着图纸盖的房子。

枚举 enum

给一堆"名字"配上一堆"数字"，让代码更好读：

const enum ReactiveFlags {
  None = 0,
  Mutable = 1,
  Dirty = 16,
}
// 用到时写名字：ReactiveFlags.Dirty
// 电脑看到的是数字：16

读法：枚举是名字和数字的对照表——人看名字，电脑看数字。

类型别名 type

给一个类型起个小名：

type Getter<T> = () => T;

读法：type 小名 = 真正的类型。写起来短，读起来明白。

箭头函数

函数的一种简洁写法，书里天天用：

const double = (x: number) => x * 2;
// 等于：function double(x) { return x * 2; }

函数类型

"函数本身也是一种数据"，也可以贴标签：

const fn: () => number = () => 42;      // 不带参数、返回数字的函数
const updater: (v: number) => void = v => { /* ... */ };  // 收一个数字、不返回

可选属性 ?

图纸上的某些房间可以没有：

interface Link {
  deps?: Link;  // 问号 = 可以没有
}

联合类型 |

"这个或那个"：

let id: number | string = 1;  // 数字或文字都行
id = 'abc';                   // 也可以

为什么我们这么写

本书所有代码都和真实库 alien-signals 保持一致——它是用 TypeScript 写的，所以我们也用 TS。等第 21 章毕业时，你写的代码和真实库的代码会一模一样。