TypeScript • المستوى الثاني • الدرس 2

القوالب العمومية المتقدمة (Generics)

أهداف الدرس العلمية

إنشاء كود مرن يعمل مع أي نوع بيانات عبر <T> مع الحفاظ على الأمان والتدقيق.
تجنب استخدام نوع any الذي يفقد التطبيق ميزة فحص الأخطاء والتلميحات الذكية.
تطبيق الـ Generics بداخل الواجهات (Generic Interfaces) لتوصيف استجابات الـ APIs المرنة.
إعادة استخدام المكونات والدوال في عدة مواضع دون تكرار البرمجة.

1. ما هي الـ Generics؟

تُعد Generics بمثابة متغيّرات تخص الأنواع (Type Variables). بدلاً من تثبيت نوع معين مثل number أو string، تتيح لك الـ Generics بناء دالة أو واجهة مرنة تتكيف وتتطابق مع نوع البيانات الذي يمرره المطور أثناء الاستدعاء.

typescript

// ❌ استخدام any يفقدنا الأمان واقتراحات الكود
function identityAny(arg: any): any {
  return arg;
}

// ✅ استخدام Generics يحافظ على نوع القيمة المرجعة مطابقاً للمدخلات
function identity<T>(arg: T): T {
  return arg;
}

let result = identity<string>("مرحباً"); // result ستكون من نوع string صريح

2. استخدام Generics مع Interfaces

🌐 توحيد استجابات الـ API

يمكنك إنشاء واجهة موحدة مثل ApiResponse<T> بحيث تعبر T عن شكل البيانات (Data Payload) المرتجعة سواء كانت مستخدماً، منتجاً، أو قائمة أرقام.

⚡ قوة التكيّف الديناميكي

تمنحك الـ Generics أقصى درجات إعادة الاستخدام (Reusability) دون التنازل عن فحص الأخطاء الصارم أثناء الكتابة.

التطبيق العملي المباشر

تحدي الدرس الثاني: استدعاء Generic مع القيمة البولينية وإنشاء واجهة مرنة

قم بالتعديل على الكود بداخل المحرر أدناه لتنفيذ ما يلي:

قم باستدعاء الدالة wrapInArray وتعديلها لتمرير قيمة بولينية (boolean) وتخزين الناتج في متغير boolArr.
أنشئ interface باسم ApiResponse<T> يحتوي على status: number و data: T.
أنشئ كائناً باسم userResponse يلتزم بـ ApiResponse المحددة واستعرض نتائجه في الكونسول.
اضغط على "تشغيل الكود" للتحقق من النتيجة وتأكيد القواعد.

⏳ جارٍ تحميل المحرر التفاعلي...

الدرس السابق الانتقال للدرس الثالث