Typescript Generisk Union


Så jeg har et array av generiske objekter og ønsker å iterere over dem, men TypeScript lar meg ikke. Her er litt eksempel på kode. Noen forslag til hvordan dette kan løses.

type someGeneric<T> = { item: T };

type stringGeneric = someGeneric<string>;

type numberGeneric = someGeneric<number>;

type someFunction = <T>(generic: someGeneric<T>) => T;

const someFunction: someFunction = (generic) => generic.item;

const stringGeneric: stringGeneric = { item: 'some String' },
    numberGeneric: numberGeneric = { item: 12 };

let genericArray = [stringGeneric, numberGeneric];
genericArray.forEach(generic => {
    someFunction(generic); // Error On This line.
});

Du kan bare kopiere og lime inn koden til denne lenken. Jeg ser ut til å ikke kunne dele koden.

Svar #1

Problemet er at funksjonen godtar en parameter av typen someGeneric<T>. Hvis vi prøver å sende inn en parameter av typen someGeneric<number> | someGeneric<string>, vil TypeScript ikke prøve å inferere T fra dette; den vil bare si at unionen ikke er kompatibel med typen someGeneric<T>.

Vi kan endre definisjonen av funksjonen slik at typeparameteren utvider someGeneric<any>. Denne begrensningen vil være kompatibel med unionen. Vi kan deretter bruke en betinget type for å hente ut elementtypen fra T ved å bruke en betinget type. Siden betingede typer distribueres over unioner, vil resultatet av uttrekket være en union av de generiske parameterne til someGeneric<T>

type someGeneric<T> = { item: T };

type stringGeneric = someGeneric<string>;

type numberGeneric = someGeneric<number>;

type extractItemFromSomeGeneric<T extends someGeneric<any>> = T extends someGeneric<infer U> ? U : never;  
type someFunction = <T extends someGeneric<any>>(generic: T) => extractItemFromSomeGeneric<T>;

const someFunction: someFunction = (generic) => generic.item;

const stringGeneric: stringGeneric = { item: 'some String' },
    numberGeneric: numberGeneric = { item: 12 };

let someGeneric = [stringGeneric, numberGeneric];
someGeneric.forEach(generic => {
    someFunction(generic); // retruns string | number
});

Lekeromlenke

Relaterte artikler