النقابات والتضييق

في العالم الحقيقي، لا تحتوي المتغيرات واستجابات واجهة برمجة التطبيقات (API) دائمًا على نوع واحد ثابت. تقدم TypeScript Union Types للتعامل مع التباين، وType Narrowing للعمل عليها بأمان في وقت التشغيل.

أنواع الاتحاد

يسمح نوع الاتحاد للمتغير بقبول قيم من أنواع مختلفة. ويتم التعبير عنها باستخدام رمز الشريط العمودي (|):

let result: number | string;
result = 42; // Valid
result = 'Error 404'; // Valid

ومع ذلك، عند العمل مع نوع موحد، لا يمكننا استدعاء الأساليب التي تنتمي إلى نوع واحد فقط من الأنواع مباشرة (على سبيل المثال، لا يمكننا استدعاء .toUpperCase() إذا كان المتغير يمكن أيضًا أن يكون number). يجب علينا أولا "تضييق" النوع.

اكتب تضييق

تضييق النوع هي العملية التي يقوم فيها TypeScript بتحليل هياكل تدفق التحكم (مثل if أو switch) لاستنتاج نوع أكثر تحديدًا لمتغير في وقت التشغيل.

هناك عدة طرق لإجراء التضييق:

1. المشغل typeof

مثالية للتمييز بين الأنواع البدائية:

function printLength(value: string | number) {
  if (typeof value === 'string') {
    // TypeScript knows 'value' is a string here
    console.log(value.length);
  } else {
    // TypeScript knows 'value' is a number here
    console.log(value.toFixed(2));
  }
}

2. المشغل in

يستخدم للتحقق من وجود خاصية معينة على كائن:

interface Fish {
  swim: () => void;
}
interface Bird {
  fly: () => void;
}

function move(animal: Fish | Bird) {
  if ('swim' in animal) {
    animal.swim(); // Narrowing to Fish
  } else {
    animal.fly(); // Narrowing to Bird
  }
}

النقابات التمييزية

يتكون نمط الاتحادات التمييزية من إنشاء كائنات تشترك في خاصية مشتركة ذات قيمة حرفية فريدة (تسمى discriminator). يتعرف TypeScript على هذا التمييز ويقوم تلقائيًا بتضييق نطاق الكتابة داخل الكتل الشرطية.

interface SuccessResponse {
  status: 'success'; // Literal discriminator
  data: string;
}

interface ErrorResponse {
  status: 'error'; // Literal discriminator
  errorMessage: string;
}

type ApiResponse = SuccessResponse | ErrorResponse;

function handleResponse(response: ApiResponse) {
  if (response.status === 'success') {
    console.log('Data received:', response.data);
  } else {
    console.error('An error occurred:', response.errorMessage);
  }
}

جربه بنفسك

التمرين 1: أنواع الاتحاد

التمرين 2: تضييق النوع الأساسي

التمرين 3: التضييق باستخدام "in"

التمرين 4: شكل الاتحاد التمييزي