TypeScript中$符号语法解析及Capitalize工具类型疑问解答

先看这份来自GitHub提案的Capitalize工具类型实现示例：

type Capitalize<S extends string> = S extends `${infer C}${infer $S}`
  ? `${Uppercase<C>}${$S}`
  : never;

疑问1：TypeScript如何识别${infer C}代表字符串的首字母？ #

这是TypeScript字符串模板类型的匹配规则决定的：当模板中没有明确的分隔字符（比如固定字符串、正则式）时，TypeScript会对第一个infer变量进行最小匹配——也就是只捕获单个字符，所以C会被赋值为字符串的首字母。

举个实际例子验证：

type WordPart<S extends string> = S extends `${infer C}${infer R}`
  ? `${C}`
  : never;
type Part = WordPart<'hello'>; // Part的类型为'h'

如果我们给模板加上明确的匹配字符，比如：

type WordPart<S extends string> = S extends `${infer C}l${infer R}`
  ? `${C}`
  : never;
type Part = WordPart<'hello'>; // Part的类型为'he'

此时TypeScript会找到第一个匹配的l，把l之前的所有内容赋值给C，剩余部分存入R（这里R是'lo'）。

疑问2：$S语法的含义是什么？ #

$S只是一个普通的类型变量名，$仅仅是变量名的一部分，没有特殊语法意义。这只是示例代码里的命名习惯，用来和常规变量名区分，或者直观表示这是字符串的「剩余部分」——你完全可以把它换成Rest或者其他合法的变量名，功能不会有任何变化。

补充说明 #

上述代码并非TypeScript内置Capitalize工具类型的实际实现。部分TS内置工具类型采用了直接调用JavaScript字符串运行时函数的方式实现，而非用类型逻辑，原因是TypeScript目前对长字符串的迭代支持不佳，容易出现类型计算溢出的问题。

内容的提问来源于stack exchange，提问作者Slava.In