如何为TypeScript字符串联合类型的每个成员添加前缀？

完全可以实现，用TypeScript的模板字面量类型配合泛型就能轻松完成你想要的效果。

首先定义通用的Prefix泛型类型：

type Prefix<P extends string, S extends string> = `${P}${S}`;

然后用你给出的例子测试：

type EventNames = 'DragStart' | 'Drag' | 'DragStop';
type HandlerNames = Prefix<'on', EventNames>; 
// 自动推导为 'onDragStart' | 'onDrag' | 'onDragStop'

原理说明 #

TypeScript的模板字面量类型支持对联合类型进行分发操作：当泛型参数S是联合类型时，${P}${S}会自动遍历S的每个成员，分别与前缀P拼接，最终生成由所有拼接结果组成的新联合类型。

如果后续需要调整前缀规则（比如给前缀和原字符串之间加分隔符、修改原字符串的大小写），也可以基于这个逻辑扩展，比如首字母小写的场景：

type PrefixLowerFirst<P extends string, S extends string> = `${P}${Lowercase<S>}`;
type LowercaseHandlerNames = PrefixLowerFirst<'on', EventNames>;
// 结果为 'ondragstart' | 'ondrag' | 'ondragstop'

内容的提问来源于stack exchange，提问作者Maciej Kravchyk