如何实现TypeScript带条件返回类型的函数？编译报错求解

你遇到的这个报错是TypeScript泛型条件类型在实际实现时的典型问题：虽然我们从逻辑上能判断typeof value === "string"时返回的{name: value}就是Value<T>对应的Name类型，但编译器的控制流分析没办法自动将泛型T的具体分支和条件类型Value<T>的结果绑定起来。而declare函数时没问题，是因为declare只做类型声明，不需要编译器验证具体实现的类型匹配。

下面是几种可行的解决方式：

方法一：使用类型断言 #

最简单的方式是通过类型断言告诉编译器你返回的类型确实符合Value<T>的约束。你可以直接断言为对应的分支类型，或者更精确地断言为Value<T>：

export type Name = { name: string }
export type Id = { id: number }
export type Value<T> = T extends string ? Name : Id

export function create<T extends string | number>(value: T): Value<T> {
  if (typeof value === "string") {
    // 断言为Name，因为此时T是string，Value<T>就是Name
    return { name: value } as Name;
  } else {
    // 断言为Id，同理此时T是number，Value<T>就是Id
    return { id: value } as Id;
  }
}

// 测试正常推导
const a = create("Bob"); // a: Name
const b = create(5); // b: Id

这种方式简单直接，只要你确保逻辑分支的正确性，就不会有类型安全问题。

方法二：使用函数重载 #

虽然Anders提到“不再需要编写函数重载”，但在某些实现场景下，重载反而能让编译器更清晰地匹配类型，同时避免类型断言：

export type Name = { name: string }
export type Id = { id: number }

// 重载签名：定义不同输入对应的输出类型
export function create(value: string): Name;
export function create(value: number): Id;

// 实现签名：处理联合类型的输入和输出
export function create(value: string | number): Name | Id {
  if (typeof value === "string") {
    return { name: value };
  } else {
    return { id: value };
  }
}

const a = create("Bob"); // a: Name
const b = create(5); // b: Id

这种方式的优势是实现代码不需要断言，编译器能通过重载签名自动推导调用时的返回类型，同时实现部分只需要处理联合类型的逻辑。

方法三：使用satisfies关键字（TypeScript 4.9+） #

如果你使用的是TypeScript 4.9及以上版本，可以用satisfies关键字让返回值满足Value<T>的约束，同时保留类型推导的准确性：

export type Name = { name: string }
export type Id = { id: number }
export type Value<T> = T extends string ? Name : Id

export function create<T extends string | number>(value: T): Value<T> {
  if (typeof value === "string") {
    const result = { name: value };
    // 确保result满足Value<T>的约束
    return result satisfies Value<T>;
  } else {
    const result = { id: value };
    return result satisfies Value<T>;
  }
}

satisfies的作用是验证表达式的类型是否符合指定类型，但不会改变表达式的原始类型，所以既保证了类型安全，又不需要强制断言。

为什么declare函数时没问题？ #

当你用declare声明函数时，只是告诉编译器这个函数的类型签名，不需要提供具体的实现代码。编译器只需要根据泛型参数T来推导返回类型Value<T>，不需要验证实现逻辑中的类型匹配，所以不会报错。而实际实现时，编译器需要检查每个分支的返回值是否能赋值给Value<T>，但泛型的分支信息没办法在控制流中被编译器完全捕获，因此出现了类型不匹配的报错。

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