0Pricing
TypeScript Academy · 课时

字符串模式类型(路由参数、事件名称)

使用模板字面量类型约束字符串:路由参数模式、事件名称命名空间和安全的构建器。

字符串模式类型(路由参数、事件名称) 是 CoddyKit 上的免费 TypeScript Academy 课时。 这是第 3 节课,共 3 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 TypeScript Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 3 节课。

简介

目标:在类型中表示字符串格式。借助模板字面量类型,您可以强制要求 "/users/:id" 或 "user:created" 等模式,同时保持出色的 DX。

  • 按前缀或后缀进行约束
  • 使用 infer 提取片段
  • 构建安全的辅助工具

路由参数

定义简单的路由模板并推断参数名称;对于不符合规则的情况返回 never。

type Route = `/${string}`

type RouteWithParam = `/${string}/:${string}`

type ParamOf<R extends string> = R extends `${string}/:${infer P}` ? P : never

// examples
type A = ParamOf<"/users/:id">      // "id"
type B = ParamOf<"/posts/:slug">    // "slug"

安全路由辅助函数

安全构建器:辅助函数只接受以“/”开头的模板;其他模板会在编译时被拒绝。

type Path<R extends string> = R extends `/${string}` ? R : never

function route<R extends Path<R>>(r: R) { return r }

const ok = route("/users/:id")    // ok
// const bad = route("users")      // error: must start with "/"

事件命名空间

限制前缀(例如 user:、order:),并通过类型阻止错误的字段名。

type EventName = `user:${string}` | `order:${string}`

function on<E extends EventName>(name: E, cb: (data: unknown) => void) {
  // ... register listener
}

on("user:created", d => {})     // ok
// on("payment:done", d => {})  // error: not an EventName

拆分事件

提取两个部分并使用推断将它们转换为带类型的字段;无效格式将不会出现。

type SplitEvent<E extends string> = E extends `${infer Scope}:${infer Action}` ? { scope: Scope; action: Action } : never

type S = SplitEvent<"user:created">   // { scope: "user"; action: "created" }

type Bad = SplitEvent<"oops">          // never

提示

提示:

保持约束简洁;过于严格的模板会迫使您重构。

使用构建器函数将规则集中在一处。

不要忘记将底层字符串映射为未知数据,并在运行时进行验证。

命名空间检查

快速检查:哪种模式可以将事件名称限制为两个命名空间?

回顾

回顾: 使用模板字面量类型限制模板字符串;使用推断剥离部分内容;创建安全的构建器函数。

常见问题解答

「字符串模式类型(路由参数、事件名称)」课时是免费的吗?

是的 — 「字符串模式类型(路由参数、事件名称)」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 TypeScript Academy 课程的其余内容,请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 3 节课。

「字符串模式类型(路由参数、事件名称)」这节课中我会学到什么?

使用模板字面量类型约束字符串:路由参数模式、事件名称命名空间和安全的构建器。 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 TypeScript Academy 需要有经验吗?

无需任何先前经验。CoddyKit 上的 TypeScript Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 3 节课,共 3 节。

「字符串模式类型(路由参数、事件名称)」课时需要多长时间?

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。

我能在这节 TypeScript Academy 课中编写并运行代码吗?

能。每节 TypeScript Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

  1. 使用 +/-readonly 与 +/-? 的映射类型
  2. 键重映射与模板字面量类型
  3. 字符串模式类型(路由参数、事件名称)
← 返回 TypeScript Academy