Kasus Penggunaan infer Praktis: Membuka Bungkus Promise

Masalah Penguraian Pembungkus

type Awaited<T> = T extends Promise<infer U> ? U : T;
type A = Awaited<Promise<string>>; // string
type B = Awaited<number>;          // number

Utilitas Awaited Bawaan

type A = Awaited<Promise<Promise<string>>>; // string
// Handles arbitrary nesting automatically

Mengurai dengan Kedalaman Kustom

type DeepAwaited<T> =
  T extends Promise<infer U> ? DeepAwaited<U> : T;
type A = DeepAwaited<Promise<Promise<number>>>; // number

Mengurai Elemen Array

type Element<T> = T extends (infer U)[] ? U : never;
type A = Element<string[]>; // string
type B = Element<number[]>; // number

Mengurai Tipe Observable

type ObservableType<T> = T extends Observable<infer U> ? U : never;
type A = ObservableType<Observable<User>>; // User

Mengurai Hasil Fungsi

async function getUser(): Promise<User> { /* ... */ }
type UserResult = Awaited<ReturnType<typeof getUser>>; // User

Mengurai Pembungkus Bertingkat

type UnwrapPromiseArray<T> =
  T extends Promise<infer U>
    ? U extends (infer V)[]
      ? V
      : U
    : T;
type A = UnwrapPromiseArray<Promise<User[]>>; // User

Penguraian Kondisional Berdasarkan Bentuk

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>;          // boolean

Pembungkus Pengambilan API Bertipe

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>>>; // User

Penguraian yang Aman dari Galat

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>; // number

Rangkuman: Mengurai dengan infer

Pemeriksaan Cepat

Yang Anda Pelajari