أصناف JavaScript
توفّر الأصناف صياغةً لتعريف كائنات لها مُنشئ وطرائق. ينشئ new نسخةً، وتعرض التجربة في النهاية tea / regular / mint.
تعريف الصنف والمُنشئ
يعمل المُنشئ عند إنشاء النسخة ويهيّئ حقولها.
class Drink {
constructor(name, size) {
this.name = name;
this.size = size;
}
}
const order = new Drink("tea", "regular");
يخزّن المُنشئ القيم في الكائن الجديد. تشير this إلى النسخة الحالية، وينشئ new Drink(...) النسخة ثم يشغّل المُنشئ.
إضافة طريقة للنسخة
تصف الطرائق الأعمال التي تستطيع النسخ تنفيذها.
class Drink {
constructor(name, size) { this.name = name; this.size = size; }
label() { return this.name + " / " + this.size; }
}
const order = new Drink("tea", "regular");
console.log(order.label());
تعيد order.label() القيمة tea / regular. توضع طرائق الصنف على prototype وتشاركها النسخ.
توسيع صنف
تنشئ extends علاقة الوراثة، ويستدعي super(...) مُنشئ الأب، بينما يستدعي super.label() الطريقة الموروثة.
class SpecialDrink extends Drink {
constructor(name, size, extra) { super(name, size); this.extra = extra; }
fullLabel() { return super.label() + " / " + this.extra; }
}
const special = new SpecialDrink("tea", "regular", "mint");
console.log(special.fullLabel());
ترث SpecialDrink الطريقة label() وتضيف extra وfullLabel(). الناتج tea / regular / mint. يجب أن يستدعي مُنشئ الصنف المشتق super(...) قبل استخدام this.
الطرائق الساكنة والحقول الخاصة
تنتمي الطريقة الساكنة إلى الصنف نفسه لا إلى نسخه. ولا يُقرأ حقل مثل #secret إلا داخل الصنف.
class Drink {
static kind() { return "drink"; }
#secret = "recipe";
reveal() { return this.#secret; }
}
console.log(Drink.kind());
console.log(new Drink().reveal());
استدعِ الطريقة الساكنة هكذا Drink.kind()، لا هكذا new Drink().kind(). ولا يمكن للكود الخارجي قراءة drink.#secret.
رؤية الأصناف في صفحة
تكتب هذه التجربة نتيجة النسخة الخاصة داخل المستند.
<p id="result"></p>
<script>
class Drink { constructor(name,size){this.name=name;this.size=size;} label(){return this.name+" / "+this.size;} }
class SpecialDrink extends Drink { constructor(name,size,extra){super(name,size);this.extra=extra;} fullLabel(){return super.label()+" / "+this.extra;} }
const order=new SpecialDrink("tea","regular","mint");
document.querySelector("#result").textContent=order.fullLabel();
</script>
تعرض الصفحة حرفياً tea / regular / mint. لا يمكن استخدام إعلان الصنف قبل موضعه؛ هذه هي temporal dead zone، وليست ادعاءً مضللاً عن hoisting.
تنظّم الأصناف إنشاء الكائنات وسلوكها. وهي تختلف عن الوحدات التي تنظّم الملفات وعن طريقة مكتوبة مباشرةً على كائن واحد.
📊 خصائص الأصناف
| الصياغة | الغرض | المثال |
|---|---|---|
constructor(...) |
تهيئة نسخة جديدة | constructor(name, size) |
this |
الإشارة إلى النسخة الحالية | this.name = name |
extends وsuper |
إعادة استخدام سلوك الأب | class SpecialDrink extends Drink |
static |
تعريف طريقة للصنف | Drink.kind() |
يلخّص هذا الجدول صياغة الأصناف الأساسية المستخدمة في الدرس.
تمرين عملي
أنشئ Drink مع name وsize وlabel(). ثم أنشئ SpecialDrink باستخدام extends وأضف extra واجعل fullLabel() تعرض tea / regular / mint. استدعِ أيضاً Drink.kind().
أخطاء شائعة
لا تستدعِ طريقة نسخة على الصنف، ولا تنسَ super(...) في المُنشئ المشتق، ولا تستخدم this قبله.
الخلاصة
يهيّئ المُنشئ الحقول، وتتشارك النسخ الطرائق عبر prototype، وتعيد الوراثة استخدام السلوك.
🧠 اختبر معرفتك
اختبر معرفتك
تحدى نفسك مع هذا الاختبار التفاعلي واكتشف مدى فهمك للموضوع
📝 التعليمات
- اقرأ كل سؤال بعناية
- اختر أفضل إجابة لكل سؤال
- يمكنك إعادة الاختبار عدة مرات كما تريد
- سيتم عرض تقدمك في الأعلى