TypeScript Academy · 课时

使用模板字面量进行解析

Q: 「使用模板字面量进行解析」这节课中我会学到什么？

使用 infer 从字符串中提取结构化数据。 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

使用 infer 从字符串中提取结构化数据。

使用模板字面量进行解析 是 CoddyKit 上的免费 TypeScript Academy 课时。这是第 3 节课，共 4 节。你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。这是 TypeScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 4 节课。

从拆分到结构

拆分会得到一个由各个部分组成的元组。解析更进一步：它会从字符串类型中提取命名的结构化数据。我们使用包含多个infer变量的模板字面量模式，提取所需的部分。

表示法：真实的 TypeScript 会使用由反引号包围、包含美元符号加大括号占位符的字符串来书写模板字面量类型。在这些代码片段中，我们将这种模式表示为 Tpl<...>，并按顺序列出每个部分；例如，匹配字面量前缀后跟 Rest 的反引号模板表示为 Tpl<'prefix', infer Rest>。

type KeyValue<S> =
  S extends Tpl<infer K, '=', infer V> ? { key: K; value: V } : never;
// Tpl<K, '=', V> matches K, an equals sign, then V

type X = KeyValue<'name=alice'>; // { key: 'name'; value: 'alice' }

多个推断点

单个模式可以一次捕获多个字段。要解析"GET /users"，可以在一个条件类型中同时推断方法和路径。

type Request<S> =
  S extends Tpl<infer Method, ' ', infer Path>
    ? { method: Method; path: Path }
    : never;
// Tpl<Method, ' ', Path> matches the method, a space, then the path

type X = Request<'GET /users'>; // { method: 'GET'; path: '/users' }

收窄推断出的部分

您可以在行内使用extends约束推断出的变量，使其只匹配特定形状。这里的方法必须是已知的动词。

type Method = 'GET' | 'POST';
type Parse<S> =
  S extends Tpl<(infer M extends Method), ' ', infer P>
    ? { method: M; path: P }
    : never;
// the inferred M is constrained to Method inside the template pattern

type X = Parse<'POST /x'>; // { method: 'POST'; path: '/x' }

解析键值对

将拆分和解析结合起来：先将查询字符串拆分成多个键值对，再将每个键值对解析为键和值。结果是一个由结构化条目组成的元组。

type Pair<S> =
  S extends Tpl<infer K, '=', infer V> ? [K, V] : [S, ''];
// Tpl<K, '=', V> splits a 'key=value' string literal type

type X = Pair<'page=2'>; // ['page', '2']

从键值对构建对象

使用映射/交叉类型累加器，将键值对元组折叠为对象类型。每个键值对都会添加一个属性。

type FromPairs<T extends [string, string][]> =
  T extends [[infer K extends string, infer V], ...infer R extends [string, string][]]
    ? { [P in K]: V } & FromPairs<R>
    : {};

type X = FromPairs<[["a", "1"], ["b", "2"]]>; // { a: "1" } & { b: "2" }

解析查询字符串

将它们组合起来：按"&"拆分，按"="解析每个片段，然后构建对象。现在，编译器知道查询字符串字面量的确切键。

type ParseQuery<S extends string> =
  FromPairs<{ [I in keyof SplitAmp<S>]: Pair<SplitAmp<S>[I] & string> }>;
// where SplitAmp splits on "&" (from previous lesson)

提取数字

推断出的部分始终是字符串字面量类型。要将某个部分视为数字，您可以检查它是否匹配数字模式，或通过仅包含数字的约束对其进行映射。该值仍然是字面量类型。

type IsNumeric<S extends string> =
  S extends Tpl<number> ? true : false;
// Tpl<number> is a template literal type that matches any numeric string

type X = IsNumeric<'42'>; // true
type Y = IsNumeric<'4a'>; // false

可选片段

使用模式的联合来处理可选部分。先尝试更丰富的模式；如果不匹配，再回退到更简单的模式。

type ParsePath<S> =
  S extends Tpl<infer Base, '?', infer Query>
    ? { base: Base; query: Query }
    : { base: S; query: '' };
// Tpl<Base, '?', Query> matches an optional query after a question mark

type X = ParsePath<'/x?a=1'>; // { base: '/x'; query: 'a=1' }

空白与边界情况

真实字符串中可能存在多余空格。将解析器与上一课中的Trim组合使用，避免开头和结尾的空白破坏提取出的字段。

type CleanKey<S extends string> = Trim<S>;
// Apply Trim to each inferred segment before using it

这为何强大

模板字面量解析让编译器能够理解各种格式：日期、路由、环境键、SQL 片段。拼写错误的字符串会变成编译错误，下游类型还可以依赖解析出的结构。字符串字面量由此成为具有类型的值。

type Event<S> =
  S extends Tpl<infer Domain, ':', infer Action>
    ? { domain: Domain; action: Action }
    : never;
// Tpl<Domain, ':', Action> matches 'domain:action'
type X = Event<'user:created'>; // { domain: 'user'; action: 'created' }

组合解析器

与值级组合子一样，类型级解析器也可以组合。先拆分，再解析每个部分，最后组装成对象。每一步都是一个小型条件类型，组合起来就形成了完整的类型化解析器。

// Split -> Pair -> FromPairs is a parser pipeline at the type level

快速检查

测试您对模板字面量解析的理解。

回顾

您已经从字符串类型中提取了结构化数据。

多个infer点可以在一个模式中捕获命名字段。
推断出的部分可以使用行内extends进行收窄。
拆分、键值对和 FromPairs 可以组合成查询解析器。
Trim 和数字检查可以处理边界情况。

下一步：构建一个完整的小型路由解析器。

常见问题解答

「使用模板字面量进行解析」课时是免费的吗？

是的 — 「使用模板字面量进行解析」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 TypeScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 4 节课。

「使用模板字面量进行解析」这节课中我会学到什么？

使用 infer 从字符串中提取结构化数据。你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 TypeScript Academy 需要有经验吗？

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

「使用模板字面量进行解析」课时需要多长时间？

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

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

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

此课程中的所有课时

← 返回 TypeScript Academy