已知类型参数时如何解析TypeScript泛型函数的返回类型？

问题背景 #

现有一批泛型字符串转换函数，期望通过通用的transform函数结合静态常量字符串，得到具体的字面量返回类型，但当前实现仅能得到宽泛类型（如Uppercase<string>），无法推导出'ZAPHOD'这类精准结果。

原代码示例：

const upperCaser = <Value extends string>(value: Value): Uppercase<Value> => 
  value.toUpperCase() as Uppercase<Value>;
const lowerCaser = <Value extends string>(value: Value): Lowercase<Value> => 
  value.toLowerCase() as Lowercase<Value>;

function transform<
  Value extends string,
  Transformer extends (arg0: Value) => any,
>(value: Value, transformer: Transformer): ReturnType<Transformer> {
  return transformer(value);
}

const myName = 'zaphod' as const;
const test = transform(myName, upperCaser); // 实际类型为 Uppercase<string>，期望为 'ZAPHOD'

问题原因 #

当前transform函数中，Transformer的约束是普通函数类型(arg0: Value) => any，而非泛型函数类型。TypeScript无法自动将Value代入Transformer的泛型参数进行实例化，因此ReturnType<Transformer>只能得到泛型函数的默认约束返回类型，而非针对具体Value的推导结果。

解决方案 #

将Transformer约束为泛型函数类型，通过条件类型的infer特性，将具体的Value代入泛型函数的参数，提取对应的返回类型。

方案一：带泛型参数约束的transform函数 #

function transform<Value extends string, Transformer extends <V extends string>(v: V) => any>(
  value: Value,
  transformer: Transformer
): Transformer extends <V>(v: V) => infer R ? (V extends Value ? R : never) : never {
  return transformer(value) as any;
}

// 测试
const myName = 'zaphod' as const;
const test = transform(myName, upperCaser); // 类型为 'ZAPHOD'
const test2 = transform(myName, lowerCaser); // 类型为 'zaphod'

方案二：简化版transform函数 #

无需额外泛型参数，直接约束第二个参数为泛型函数，TypeScript会自动代入Value进行推导：

function transform<Value extends string>(
  value: Value,
  transformer: <V extends Value>(v: V) => any
): ReturnType<typeof transformer> {
  return transformer(value) as ReturnType<typeof transformer>;
}

// 测试效果一致
const test = transform(myName, upperCaser); // 'ZAPHOD'

原理说明 #

当transformer被约束为泛型函数类型时，TypeScript会将传入的具体Value作为泛型参数代入该函数，从而推导出针对该值的具体返回类型，而非泛型函数的宽泛约束类型。

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