TupleToUnion และ UnionToIntersection

TupleToUnion: แนวคิด

type TupleToUnion<T extends readonly any[]> = T[number];
type A = TupleToUnion<[string, number, boolean]>; // string | number | boolean

T[number] ทำงานอย่างไร

type Tuple = [string, number, boolean];
type Elements = Tuple[number]; // string | number | boolean

TupleToUnion ด้วย as const

const COLORS = ["red", "green", "blue"] as const;
type Color = typeof COLORS[number]; // "red" | "green" | "blue"

UnionToIntersection: แนวคิด

type UnionToIntersection<U> =
  (U extends any ? (x: U) => void : never) extends (x: infer I) => void
    ? I
    : never;

เหตุใดกลเม็ดฟังก์ชันจึงทำงาน

type A = UnionToIntersection<{ a: 1 } | { b: 2 }>;
// { a: 1 } & { b: 2 }

UnionToTuple: ปัญหาที่ยาก

// Not reliable — union member order is unspecified
// Use TupleToUnion (safe) not UnionToTuple (fragile)

การใช้งาน TupleToUnion ในทางปฏิบัติ

const ALLOWED_METHODS = ["GET", "POST", "PUT", "DELETE"] as const;
type HttpMethod = typeof ALLOWED_METHODS[number];
function request(method: HttpMethod) { /* ... */ }

การใช้งาน UnionToIntersection ในทางปฏิบัติ

type Mixin1 = { log(): void };
type Mixin2 = { save(): Promise<void> };
type Combined = UnionToIntersection<Mixin1 | Mixin2>;
// { log(): void } & { save(): Promise<void> }

อินเตอร์เซกชันของชนิดพื้นฐาน

type X = UnionToIntersection<string | number>; // never

การใช้สิ่งเหล่านี้ในข้อจำกัดแบบทั่วไป

function merge<T extends object[]>(...args: T): UnionToIntersection<T[number]> {
  return Object.assign({}, ...args) as any;
}

ทบทวน: ทูเพิล ↔ ยูเนียน ↔ อินเตอร์เซกชัน

ตรวจสอบความเข้าใจ

สิ่งที่ได้เรียนรู้