الكلمة المفتاحية extends
جزء من قسم Object Oriented Programming في رحلة JavaScript على Coddy — الدرس 26 من 56.
تُستخدم الكلمة المفتاحية extends في JavaScript لإنشاء فئة فرعية ترث الخصائص والأساليب من فئة أب.
لنقم أولاً بإنشاء فئة أب (parent class):
class Animal {
constructor(name) {
this.name = name;
}
speak() {
return `${this.name} makes a noise.`;
}
}الآن، لنقم بإنشاء فئة تابعة (child class) ترث من الفئة الأب (parent class):
class Dog extends Animal {
// ترث الفئة Dog من الفئة Animal
}يعني هذا الكود البسيط أن فئة Dog ترث الآن جميع الخصائص والأساليب من فئة Animal.
قم بإنشاء مثيل (instance) للكلب:
const dog = new Dog('Rex');استدعاء دالة موروثة من الفئة الأب:
console.log(dog.speak()); // المخرجات: "Rex makes a noise."تنشئ الكلمة المفتاحية extends علاقة وراثة حيث يمكن للفئة الابنة (Dog) الوصول إلى جميع الوظائف المحددة في الفئة الأب (Animal) واستخدامها.
التحدي
أنشئ فئة Student التي توسع فئة Person باستخدام الكلمة المفتاحية extends وقم بتصديرها.
ورقة مرجعية
تُنشئ الكلمة المفتاحية extends فئة فرعية (child class) ترث الخصائص والأساليب من فئة أب (parent class):
class Animal {
constructor(name) {
this.name = name;
}
speak() {
return `${this.name} makes a noise.`;
}
}
class Dog extends Animal {
// يرث Dog من Animal
}
const dog = new Dog('Rex');
console.log(dog.speak()); // المخرجات: "Rex makes a noise."يمكن للفئة الفرعية الوصول إلى جميع الخصائص والأساليب من الفئة الأب.
جرّب بنفسك
import { Student } from './classes.js';
// كود الاختبار - لا تقم بالتعديل
const student = new Student("Emma");
console.log(student.greet()); // يجب أن تكون النتيجة "Hello, I'm Emma"يتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.
جميع دروس Object Oriented Programming
1الكائنات والكلمة المفتاحية this
مراجعة سريعة: الكائناتإضافة Methods إلى الكائناتفهم الكلمة المفتاحية thisConstructor Functionsالكلمة المفتاحية newتحدي المراجعة7الوراثة والكلمة المفتاحية extends
الوراثةعلاقة "is-a"الكلمة المفتاحية extendsالدالة super()وراثة الخصائص والوظائفتحدي المراجعة2تنظيم الكود
ما هي الـ Modules؟التصدير باستخدام exportالاستيراد باستخدام importالـ Default مقابل الـ Named Exports8تنظيم كود OOP
تنظيم الـ Classes في Modules11مشروع: مصيّر الأشكال
إعداد: فئة Shape والتصديروراثة فئة Circle