如何让TypeScript工具函数返回类型随输入可空性动态变化？

你需要实现的是输入非空则返回非空，输入可空则返回可空的工具函数，下面给出两种可行的解决方案，并解释之前写法报错的原因：

方案一：优化泛型条件类型实现 #

之前的条件类型写法中，TypeScript无法在函数体内部跟踪泛型的具体分支，导致返回值类型不匹配。调整条件类型定义并配合类型断言即可解决：

const toUpper = <TInput extends string | undefined>(
    input: TInput
): TInput extends undefined ? undefined : string => {
    if (!input) return undefined as ReturnType<typeof toUpper>;
    return input.toUpperCase() as ReturnType<typeof toUpper>;
};

效果验证 #

const str1: string = 'foo'; 
const str2: string | undefined = 'bar';
const str3: string | undefined = undefined;

const upper1 = toUpper(str1); // 推断为 string 类型
const upper2 = toUpper(str2); // 推断为 string | undefined 类型
const upper3 = toUpper(str3); // 推断为 undefined 类型

方案二：修正函数重载写法 #

之前的重载缺少对string | undefined联合类型输入的处理，补充对应的重载签名后即可正常编译：

// 针对单一类型的重载签名
function toUpper(input: string): string;
function toUpper(input: undefined): undefined;
// 针对联合类型的重载签名
function toUpper(input: string | undefined): string | undefined;
// 函数实现
function toUpper(input: string | undefined) {
    if (!input) return undefined;
    return input.toUpperCase();
}

效果验证 #

和方案一完全一致，能正确推断所有场景的返回类型。

之前写法报错的原因 #

1. 条件类型版本：TypeScript泛型条件类型在函数体内部是"黑盒"状态，编译器无法确定TInput具体是string还是undefined，因此无法验证return undefined是否符合条件类型的要求，必须用类型断言明确告知编译器。
2. 重载版本：原重载只定义了单一输入类型的情况，没有覆盖string | undefined的联合类型输入，导致编译器找不到匹配的重载签名，补充联合类型的重载签名后即可解决。

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