13 - TS课程总结

TS 总结

总结了TS的一些核心思想和特点，这有助于更好地理解和使用TS。

类型检查很有用

1. 检查错误：帮助开发者在代码编写阶段捕捉潜在错误。
2. 一次写过（减少Debug)：减少后期的调试时间，提高开发效率。
3. 辅助系统设计（类型的思考方式）：类型系统有助于系统的设计，使设计更加合理和健壮。

类型是可以推导的

类型系统的构造：
- 每个变量/值的类型：定义每个变量或值的类型。
- 操作符的类型：定义每个操作符的行为和返回值类型。
- 表达式类型：定义每个表达式的返回值类型。
- 函数的类型：定义函数的参数类型和返回值类型。
- 类的类型：定义类的属性和方法的类型。

目标是让所有程序都有类型！
- 更好的代码提示：有助于开发者快速编写代码。
- 更好的书写检查：提前捕捉代码中的错误。
- 更好的错误提示：清晰的错误提示有助于快速定位问题。

类型是可以计算的

类型不仅可以定义，还可以通过计算得到新的类型。这为TS提供了强大的抽象能力。

// 例子：解包Promise中的类型
type Unwrap<T> = T extends Promise<infer U> ? U : T;
type p = Unwrap<Promise<number>>;

// 例子：路由参数的类型推导
type RouteParams<Route extends string> =
  Route extends `${string}:${infer Rest}`
    ? RouteDic<Rest>
    : never;

type RouteDic<Arg extends string> = {
  [p in Arg]: string;
};

const path = "/a/:page";
const params: RouteParams<typeof path> = {
  'page': 'abc'
};

类型帮助我们思考

使用类型系统可以帮助我们思考代码的结构和设计。

思考【什么东西是什么】？
例如：FC和ComponentClass是什么？

思考：如何设计一个类型来存储css的长度？
以下的方案是一个简单的示例，可以表示CSS的大小。
type CSSSize = {
    value: number,
    unit: string
};