Praktiska användningsfall för infer: packa upp Promises
Packa upp typer för Promise, Array och anpassade wrappers
Praktiska användningsfall för infer: packa upp Promises är en gratis lektion i TypeScript Academy på CoddyKit. Detta är lektion 4 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för TypeScript Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i TypeScript Academy innehåller totalt 4 lektioner.
Problemet med uppackning
När ni arbetar med asynkron kod får ni ofta Promise och behöver den underliggande T. Nyckelordet infer gör denna extrahering återanvändbar.
type Awaited<T> = T extends Promise<infer U> ? U : T;
type A = Awaited<Promise<string>>; // string
type B = Awaited<number>; // numberDen inbyggda verktygstypen Awaited
TypeScript 4.5 introducerade den inbyggda Awaited, som hanterar kapslade löften rekursivt.
type A = Awaited<Promise<Promise<string>>>; // string
// Handles arbitrary nesting automaticallyUppackning med anpassat djup
Innan Awaited blev inbyggt använde utvecklare rekursiva typer med infer för att packa upp löften.
type DeepAwaited<T> =
T extends Promise<infer U> ? DeepAwaited<U> : T;
type A = DeepAwaited<Promise<Promise<number>>>; // numberUppackning av arrayelement
Samma infer-mönster extraherar elementtypen från en array, vilket motsvarar den inbyggda metoden med T[number].
type Element<T> = T extends (infer U)[] ? U : never;
type A = Element<string[]>; // string
type B = Element<number[]>; // numberUppackning av Observable-typer
För RxJS Observable-objekt extraherar infer typen som skickas ut.
type ObservableType<T> = T extends Observable<infer U> ? U : never;
type A = ObservableType<Observable<User>>; // UserUppackning av funktionsreturer
Kombinera ReturnType och Awaited för att få det upplösta värdet från en asynkron funktion.
async function getUser(): Promise<User> { /* ... */ }
type UserResult = Awaited<ReturnType<typeof getUser>>; // UserUppackning av kapslade omslag
Det går att kedja infer för att hantera typer som är omslutna i flera lager, till exempel Promise.
type UnwrapPromiseArray<T> =
T extends Promise<infer U>
? U extends (infer V)[]
? V
: U
: T;
type A = UnwrapPromiseArray<Promise<User[]>>; // UserVillkorsbaserad uppackning efter struktur
Använd infer för att endast packa upp vissa typer villkorsstyrt och lämna övriga oförändrade.
type MaybeUnwrap<T> =
T extends Promise<infer U> ? U : T extends (infer V)[] ? V : T;
type A = MaybeUnwrap<Promise<string>>; // string
type B = MaybeUnwrap<number[]>; // number
type C = MaybeUnwrap<boolean>; // booleanTypsäker API-fetch-wrapper
En generisk fetch-wrapper som returnerar den upplösta datatypen är ett klassiskt användningsområde för infer-baserad uppackning.
async function fetchData<T>(url: string): Promise<T> {
const res = await fetch(url);
return res.json() as T;
}
type UserData = Awaited<ReturnType<typeof fetchData<User>>>; // UserFelsäker uppackning
Result-mönstret i kombination med infer gör det möjligt att extrahera framgångstypen från en diskriminerad union.
type Ok<T> = { ok: true; value: T };
type Err = { ok: false; error: string };
type ExtractOk<T> = T extends Ok<infer V> ? V : never;
type A = ExtractOk<Ok<number> | Err>; // numberSammanfattning: uppackning med infer
Nyckelordet infer är den schweiziska armékniven för att extrahera typer från omslag – löften, arrayer, Observable-objekt och Result-typer. Den inbyggda Awaited hanterar asynkron uppackning; använd anpassade typer för andra strukturer.
Snabbkontroll
Vilket är det bästa sättet att få den upplösta värdetypen från en asynkron funktion?
Det här har du lärt dig
Infer-baserad uppackning är ett praktiskt verktyg för asynkron TypeScript-kod. Använd den inbyggda Awaited för löften och bygg anpassade uppackningstyper för arrayer, Observable-objekt och Result-mönster.
Lär dig TypeScript med en AI-lärare – gratis
Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.
- Kurser
- 101
- Lektioner
- 352
Vanliga frågor
Är lektionen ”Praktiska användningsfall för infer: packa upp Promises” gratis?
Ja – hela texten till ”Praktiska användningsfall för infer: packa upp Promises” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i TypeScript Academy, kan Ni uppgradera till CoddyKit PRO. Kursen i TypeScript Academy innehåller totalt 4 lektioner.
Vad lär jag mig i ”Praktiska användningsfall för infer: packa upp Promises”?
Packa upp typer för Promise, Array och anpassade wrappers Ni övar på TypeScript Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.
Behöver jag någon erfarenhet för att börja lära mig TypeScript Academy?
Du behöver inga förkunskaper. Utbildningen i TypeScript Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 4 av 4.
Hur lång tid tar lektionen ”Praktiska användningsfall för infer: packa upp Promises”?
De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.
Kan jag skriva och köra kod i den här TypeScript Academy-lektionen?
Ja. Varje TypeScript Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.
Alla lektioner i den här kursen
- Förstå infer i villkorstyper
- Bygg ReturnType och Parameters från grunden
- Mönster för djupt nästlad typinferens
- Praktiska användningsfall för infer: packa upp Promises