类型推断如何与 TypeScript 中的联合类型（+条件类型和泛型）一起使用？

Question

I am developing a game in Angular, and trying to decouple presentation from game logic. In order to achieve this I have built a separate UiController service to handle user interactions and presentation. Services related to game logic make requests to UiController whenever something needs to be shown or a user action is needed.

In order to achieve this as neatly as possible, I'm trying to abstract away interfaces to interact with UiController . One common interaction is choice , used when players must choose one among different options of the same category. That interaction is handled by a requestChoice() method of UiController , which requires a parameter of ChoiceRequest type. Since there are many different categories for choices, this type must contain all of them and the method must know how to deal with all of them.

For instance, users may be required to choose monsters or heroes. I use literal types to refer to options in choices:

type HeroType = 'warrior' | 'rogue' | 'mage';
type MonsterType = 'goblin' | 'demon' | 'dragon';

The first approach that occured to me to build ChoiceRequest was to use generics and conditional types:

type ChoiceType = 'hero' | 'monster';

type OptionsSet<T extends ChoiceType> = T extends 'hero'
  ? HeroType[]
  : T extends 'monster'
  ? MonsterType[]
  : never;

interface ChoiceRequest<T extends ChoiceType> {
  player: Player;
  type: T;
  options: OptionsSet<T>;
}

This proved useful when building choice requests like this, since the values for type and items in options are correctly predicted or rejected:

const request: ChoiceRequest<'monster'> = {
  player: player2,
  type: 'monster',              // OK, any other value wrong
  options: ['demon', 'goblin']  // OK, any value not included in MonsterType wrong.
}

However, type inference does not work as expected when I try to make requestChoice() method handle different cases:

public requestChoice<T extends ChoiceType>(request: ChoiceRequest<T>) {
  switch (request.type) {
    case 'a':             // OK, but should complain since values can only be 'hero' or 'monster'
      ...
    case 1:               // Here it complains, see below (*)
      ...
    ...
  }
}

(*) Type 'number' is not comparable to type 'T'. 'T' could be instantiated with an arbitrary type which could be unrelated to 'number'.

I have had this problem repeatedly before, but I don't fully understand why this happens. I thought it had something to do with conditional types, so I then tried a less elegant second approach :

interface ChoiceMap {
  hero: HeroType[];
  monster: MonsterType[];
}

type ChoiceType = keyof ChoiceMap;

interface ChoiceRequest<T extends ChoiceType> {
  player: Player;
  type: T;
  options: ChoiceMap[T];
}

However, this approach worked exactly as the first.

The only way to make this work as expected was a third approach , building ChoiceRequest explicitly as a tagged union, without generics or conditional types:

interface MonsterRequest {
  player: Player;
  type: 'monster';
  options: MonsterType[];
}

interface HeroRequest {
  player: Player;
  type: 'hero';
  options: HeroType[];
}

type ChoiceRequest = MonsterRequest | HeroRequest;

QUESTIONS: Why does the third approach work and the first two don't? What I am missing about how type inference works? Are there other patterns to achieve what I need in scenarios like this?

Answer 1

If you don't need T in the return type a very simple workaround is probably:

function requestChoice(request: ChoiceRequest<ChoiceType>) {
  switch (request.type) {
    case 'a':             // Type '"a"' is not comparable to type ChoiceType
    case 1:               // Type '1' is not comparable to type ChoiceType
    case "hero": // fine
  }
}