字符串模式类型(路由参数、事件名称)
使用模板字面量类型约束字符串:路由参数模式、事件名称命名空间和安全的构建器。
字符串模式类型(路由参数、事件名称) 是 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 反馈 — 无需本地设置。
此课程中的所有课时
- 使用 +/-readonly 与 +/-? 的映射类型
- 键重映射与模板字面量类型
- 字符串模式类型(路由参数、事件名称)