الانتقال إلى المحتوى الرئيسي
الوحدة 7 · الدرس 2 من 214/14 في الدورة~15 min
دروس الوحدة (2/2)

الإعلانات والاندماج

تُستخدم ملفات تعريف النوع (ذات الامتداد .d.ts) في TypeScript لوصف شكل كود JavaScript الموجود دون تنفيذ أي منطق فعلي. أنها تحتوي فقط على تعريفات النوع والواجهات وتوقيعات الوظائف.

تعتبر هذه الملفات ضرورية عند استخدام مكتبات الجهات الخارجية المكتوبة بلغة JavaScript خالصة.


دمج الإعلان

دمج الإعلان هو سلوك يقوم فيه المترجم بدمج إعلانين منفصلين أو أكثر معلنين بنفس الاسم في تعريف واحد.

الحالة الأكثر شيوعًا هي دمج الواجهة:

TS
interface User {
  name: string;
}

interface User {
  age: number;
}

// The resulting User interface has both name and age properties!
const student: User = {
  name: 'Alice',
  age: 23,
};

إذا كانت الخصائص تشترك في نفس الاسم، فيجب أن تكون من نفس النوع، وإلا فإن TypeScript ستبلغ عن خطأ.


تعديل الوحدات العالمية والخارجية

يمكننا استخدام دمج الإعلانات لتوسيع الواجهات المحددة في وحدات أخرى أو في النطاق العالمي.

على سبيل المثال، إذا أردنا إضافة خاصية إلى كائن window العام للمتصفح:

TS
declare global {
  interface Window {
    analyticsToken: string;
  }
}

باستخدام declare global، نخبر TypeScript أننا نقوم بإدخال توقيع جديد في واجهة Window العامة الحالية.


جربه بنفسك

التمرين 1: دمج الإعلان الأساسي

تمرين#ts.m7.l2.e1
المحاولات: 0جارٍ التحميل…

في TypeScript، يتم دمج الواجهات التي لها نفس الاسم في نفس النطاق تلقائيًا. قم بتعريف مستخدم الواجهة باسم الخاصية: سلسلة، ثم في الكتلة الثانية قم بإعلان نفس الواجهة المستخدم بإضافة خاصية العمر: الرقم. أخيرًا، أعلن عن مستخدم ثابت من النوع User بالقيم المناسبة.

جارٍ تحميل المحرر…
إظهار التلميح

قم بتعريف مستخدم الواجهة مرتين، وإدراج الخصائص المعنية، ثم قم بتعيين الحقول لكائن المستخدم.

الحل متاح بعد 3 من المحاولات

التمرين 2: توسيع واجهة النافذة العالمية

تمرين#ts.m7.l2.e2
المحاولات: 0جارٍ التحميل…

تخيل أنك تريد توسيع واجهة النافذة العامة لإضافة خاصية مخصصة تسمى التكوين من النوع Record<string, string>. اكتب الإعلان الصحيح باستخدام التصريح العمومي لدمج الخاصية الجديدة في واجهة النافذة العامة.

جارٍ تحميل المحرر…
إظهار التلميح

استخدم الإعلان العالمي {interface Window { config: Record<string, string>; } }.

الحل متاح بعد 3 من المحاولات