Menu
Coddy logo textTech
flag Ar iconالعربيةdown icon

مقدمة عن الواجهات (Interfaces)

جزء من قسم Introduction To TypeScript في رحلة JavaScript على Coddy. الدرس 39 من 73.

تؤدي interfaces الغرض الأساسي نفسه الذي تؤديه الأسماء المستعارة للأنواع للكائنات، لكنها تستخدم صياغة مختلفة وتوفر بعض الإمكانات الفريدة.

يتم التصريح عن الواجهة باستخدام الكلمة المفتاحية interface متبوعة باسم الواجهة وبنية الكائن بين أقواس معقوفة:

interface Animal {
  name: string;
  sound: string;
}

let dog: Animal = {
  name: "Buddy",
  sound: "Woof"
};

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

challenge icon

التحدي

سهل

أنشئ واجهة باسم Pet بالخصائص التالية:

  • name من النوع string
  • species من النوع string
  • age من النوع number
  • isVaccinated من النوع boolean

أنشئ واجهة باسم Vehicle بالخصائص التالية:

  • make من النوع string
  • model من النوع string
  • year من النوع number

باستخدام الواجهات الخاصة بك، أنشئ المتغيرات التالية:

  • أنشئ متغيرًا باسم myDog من النوع Pet، بحيث يكون الاسم "Buddy"، والنوع "Golden Retriever"، والعمر 3، وisVaccinated بقيمة true
  • أنشئ متغيرًا باسم myCat من النوع Pet، بحيث يكون الاسم "Whiskers"، والنوع "Persian"، والعمر 2، وisVaccinated بقيمة false
  • أنشئ متغيرًا باسم myCar من النوع Vehicle، بحيث تكون الشركة المصنّعة "Toyota"، والطراز "Camry"، والسنة 2022

أنشئ دالة باسم describePet تقبل معلمة من النوع Pet وتُرجع قيمة من النوع string بالتنسيق "[name] is a [age]-year-old [species]".

أنشئ دالة باسم getVehicleInfo تقبل معلمة من النوع Vehicle وتُرجع قيمة من النوع string بالتنسيق "[year] [make] [model]".

اطبع المخرجات التالية في أسطر منفصلة:

  • استدعِ describePet باستخدام myDog واطبع النتيجة
  • استدعِ describePet باستخدام myCat واطبع النتيجة
  • استدعِ getVehicleInfo باستخدام myCar واطبع النتيجة
  • اطبع حالة تطعيم myDog (خاصية isVaccinated)

جرّب بنفسك

// TODO: اكتب الكود الخاص بك هنا

// أنشئ واجهة Pet

// أنشئ واجهة Vehicle

// أنشئ المتغيرات باستخدام واجهاتك

// أنشئ الدالة describePet

// أنشئ الدالة getVehicleInfo

// اطبع المخرجات المطلوبة
quiz iconاختبر نفسك

يتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.

جميع دروس Introduction To TypeScript

تدرّب بنفسك: مترجم JavaScript عبر الإنترنت