ProgrammatieTypeScript/Fullstack ontwikkelaar

Hoe werken Conditionele Types met infer in TypeScript, in welke situaties zijn ze nodig, en welke fouten komen in de praktijk voor?

Slaag voor sollicitatiegesprekken met de Hintsage AI-assistent

Antwoord.

Conditionele Types met het sleutelwoord infer stellen je in staat om types uit complexe datatypes te extraheren. Een klassiek voorbeeld is het extraheren van het type element uit een array:

type ElementType<T> = T extends (infer U)[] ? U : T;

Hier stelt infer U je in staat om het type van het element van de array T te berekenen. Als T een array is, wordt het type van zijn elementen geretourneerd, anders zelf T.

Waar worden ze gebruikt:

  • Voor het schrijven van universele helper-types (bijvoorbeeld, het extraheren van het return type uit een functie, het type van de waarde van een Promise, enzovoorts).

Voorbeeld:

type ReturnType<T> = T extends (...args: any[]) => infer R ? R : any;

Vraag met een val.

Kan je meerdere infer gebruiken in één conditioneel type? Hoe interpreteert TypeScript deze situatie?

Verkeerd antwoord:

  • "Je kunt niet meer dan één infer gebruiken, TypeScript laat dit niet toe."

Juist antwoord:

  • Je kunt meerdere infer-variabelen in één sjabloon gebruiken. Bijvoorbeeld, bij het ontleden van een tuple:
type FirstArgument<T> = T extends (infer F, ...any[]) => any ? F : never; // Maar het is nauwkeuriger met functies: type Args<T> = T extends (...args: infer A) => any ? A : never;
  • TypeScript concludeert correct meerdere types via verschillende infer-variabelen.

Voorbeelden van echte fouten door onbekendheid met de nuances van het onderwerp.


Verhaal

Een ontwikkelaar schreef een manier om het type object te krijgen dat door een functie wordt geretourneerd, maar vergat dat de functie mogelijk een Promise kan retourneren. Uiteindelijk was het type van de retourwaarde altijd Promise<any>, omdat een genest conditie met extract/infer niet werd gebruikt. De code moest in de hele basis opnieuw worden gefactoreerd.


Verhaal

In het project werd een universeel type geïntroduceerd voor het uitpakken van geneste arrays, maar men vergat de uiteindelijke else-tak in de voorwaarde te vermelden. TypeScript gaf geen fout, maar in sommige gevallen was het resultaat never, waardoor sommige utility-typisaties in externe bibliotheken sneuvelden.


Verhaal

Een collega probeerde de types van eigenschappen uit een grote interface te extraheren via een combine-conditioneel/infer-type, maar vergat dat sommige eigenschappen zelf union-types waren. Dit resulteerde in onverwachte combinaties van union-types aan de uitvoer, de compiler liet dit passeren, terwijl de logica niet correct functioneerde.