0Pricing
TypeScript Academy · درس

تمديد الواجهات ودمجها

مدّدوا الواجهات وافهموا دمج التصريحات

تمديد الواجهات ودمجها درس مجاني في TypeScript Academy على CoddyKit. هذا هو الدرس 3 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في TypeScript Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة TypeScript Academy 4 دروس في المجموع.

مرحبًا

يمكن للواجهات توسيع واجهات أخرى للبناء على هياكل موجودة، كما يدمج TypeScript تلقائيًا التصريحات المتعددة للواجهة نفسها.

توسيع واجهة

استخدم الكلمة المفتاحية `extends` لإنشاء واجهة جديدة تتضمن جميع خصائص الواجهة الأصلية.
interface Animal { name: string; }
interface Dog extends Animal {
  breed: string;
}
const rex: Dog = { name: 'Rex', breed: 'Labrador' };

توسيع واجهات متعددة

يمكن للواجهة توسيع عدة واجهات في الوقت نفسه، بحيث تجمع جميع خصائصها.
interface Flyable { fly(): void; }
interface Swimmable { swim(): void; }
interface Duck extends Flyable, Swimmable {
  quack(): void;
}

تجاوز الخصائص عند التوسيع

يمكن للواجهة الموسَّعة تجاوز خاصية من الواجهة الأصلية، لكن يجب أن يكون النوع الجديد قابلًا للإسناد إلى نوع الواجهة الأصلية.
interface Base { value: string | number; }
interface Derived extends Base { value: string; } // OK — string is narrower
// interface Bad extends Base { value: boolean; } // Error

دمج التصريحات

عند التصريح بواجهتين تحملان الاسم نفسه، يدمجهما TypeScript في واجهة واحدة تتضمن جميع الخصائص.
interface Window { title: string; }
interface Window { location: Location; }
// Merged: Window has both title and location

توسيع أنواع المكتبات

يُستخدم دمج التصريحات لتوسيع أنواع الجهات الخارجية. فعلى سبيل المثال، يمكنك إضافة خصائص إلى واجهة Request في Express.
// express.d.ts
declare namespace Express {
  interface Request {
    user?: User;
  }
}

توسيع اسم مستعار لنوع باستخدام واجهة

يمكن للواجهة توسيع اسم مستعار لنوع ما دام الاسم المستعار يمثل نوع كائن.
type Named = { name: string };
interface User extends Named { email: string; }

سلاسل التوسيع المتداخلة

يمكن أن تمتد سلاسل التوسيع عبر مستويات متعددة.
interface A { a: number; }
interface B extends A { b: number; }
interface C extends B { c: number; }
const obj: C = { a: 1, b: 2, c: 3 };

المقارنة بين extends وimplements

يُستخدم `extends` للتوريث بين الواجهات أو بين الأصناف. أما `implements` فيُستخدم لكي يفي صنف بعقد واجهة.
interface Serializable { serialize(): string; }
class Model implements Serializable {
  serialize() { return JSON.stringify(this); }
}

يضيف الدمج الخصائص إلى جميع الاستخدامات

عند دمج الواجهات، تحصل جميع التعليمات البرمجية الموجودة التي تستخدم تلك الواجهة تلقائيًا على الخصائص الجديدة، ولهذا يعمل توسيع المكتبات.

الدمج أم التوسيع: متى نستخدم كلًا منهما

استخدم `extends` لإنشاء واجهة جديدة تستند إلى واجهة موجودة. واستخدم الدمج (بالاسم نفسه) لإضافة خصائص إلى واجهة من ملف منفصل، كما يحدث عند التوسيع.

تحقّق سريع

ما ميزة TypeScript التي تتيح لك إضافة خصائص إلى واجهة من مكتبة تابعة لجهة خارجية؟

مراجعة

توسّع الواجهات واجهات أخرى باستخدام `extends`، فتجمع هياكلها. ويجمع دمج التصريحات تلقائيًا الواجهات التي تحمل الاسم نفسه. ويتيح ذلك توسيع المكتبات من دون تعديل تعليمات برمجية تابعة لجهات خارجية.

الأسئلة الشائعة

هل درس «تمديد الواجهات ودمجها» مجاني؟

نعم — نص درس «تمديد الواجهات ودمجها» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة TypeScript Academy، انتقل إلى CoddyKit PRO. تتضمن دورة TypeScript Academy 4 دروس في المجموع.

ماذا ستتعلم في «تمديد الواجهات ودمجها»؟

مدّدوا الواجهات وافهموا دمج التصريحات تتمرن على TypeScript Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ TypeScript Academy؟

لا تُشترط خبرة سابقة. TypeScript Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 3 من أصل 4.

كم من الوقت يستغرق درس «تمديد الواجهات ودمجها»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس TypeScript Academy هذا؟

نعم. كل درس في TypeScript Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. تعريف أشكال الكائنات باستخدام الواجهات
  2. الأسماء المستعارة للأنواع المعقدة
  3. تمديد الواجهات ودمجها
  4. الواجهة أم النوع: متى تستخدمون كلًّا منهما
← العودة إلى TypeScript Academy