TypeScript • المستوى الأول • الدرس 4

تعريف الكائنات والواجهات (Interfaces & Type Aliases)

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

بناء عقود تنظيمية وهيكلية للكائنات بكلمة interface.
استخدام الخصائص الاختيارية (Optional Properties) بعلامة ?.
فهم الفرق بين interface و type Alias وأوقات استخدام كل منهما.
تطبيق الأمان البرمجي على بنية الكائنات وتجنب إضافة حقول غير معرفة.

1. فائدة الـ Interfaces

تُعد الواجهات (Interfaces) الطريقة القياسية لبناء هيكل البيانات الخاص بالكائنات في TypeScript. تعمل الواجهة كعقد ملزم (Contract)، يحظر إنشاء أية كائنات ناقصة للخصائص المطلوبة أو تحوي خصائص بأسماء أو أنواع مختلفة.

typescript

interface Article {
  id: number;
  title: string;
  published?: boolean; // خاصية اختيارية (Optional Property)
}

const myArticle: Article = {
  id: 10,
  title: "تعلم TypeScript"
  // published غير موجودة ولكنه مقبولة لأنها اختيارية (?)
};

2. الفرق بين Interface و Type Alias

📑 interface

مخصصة في المقام الأول لوصف هياكل الكائنات وتدعم التوسعة والتجميع المباشر (Declaration Merging).

🏷️ type Alias

مرنة جداً، وتُستخدم لتسمية أي نوع مثل Primitive, Union Types, Tuples والكائنات أيضاً.

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

تحدي الدرس الرابع: إضافة الخصائص واستخدام Type Alias

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

قم بإضافة الخاصية الاختيارية isAdmin: true بداخل كائن userObj وطباعتها بـ console.log.
أنشئ type Alias مخصص باسم Product يحتوي على: id: number و title: string و price: number.
أنشئ كائناً باسم productObj بالنوع Product وقم بتعيين قيم مجزية للخصائص.
اطبع تفاصيل المنتج في الكونسول ثم اضغط "تشغيل الكود".

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

الدرس السابق الانتقال للمستوى الثاني