Discriminated Unions

مفهوم ~20 دقيقة

Discriminated Unions

Discriminated union هي union بين أشكال لها خاصية مشتركة تميز الحالة، مثل kind أو type. مثال: { kind: "loading" } | { kind: "success"; data: User } | { kind: "error"; message: string }. عند فحص state.kind, يعرف TypeScript الخصائص المتاحة في كل فرع.

هذا النمط ممتاز لحالة الواجهة، API results، workflows، وأي مجال له حالات محددة. بدلاً من boolean كثيرة مثل loading, error, data, اجعل الحالة واحدة من أشكال واضحة.

مثال عملي

index.ts

type LoadState =
  | { kind: "loading" }
  | { kind: "success"; value: string }
  | { kind: "error"; message: string };

function renderState(state: LoadState): string {
  switch (state.kind) {
    case "loading":
      return "Loading";
    case "success":
      return state.value;
    case "error":
      return `Error: ${state.message}`;
  }
}

console.log(renderState({ kind: "success", value: "Ready" }));

Output:

داخل كل case، يعرف TypeScript الشكل الدقيق.

تحدي — Challenge

type State = { kind: "ok"; value: string } | { kind: "error"; message: string };
const state: State = { kind: "error", message: "failed" };

switch (state.kind) {
  case "ok":
    console.log(state.value);
    break;
  case "error":
    // اطبع Error: <message> — Print Error: <message>
    break;
}