فئات JavaScript
قدم ECMAScript 2015 ، المعروف أيضًا باسم ES6 ، فئات JavaScript.
فئات JavaScript هي قوالب لكائنات JavaScript.
بناء جملة فئة JavaScript
استخدم الكلمة الأساسية classلإنشاء فصل دراسي.
أضف دائمًا طريقة باسم constructor():
بناء الجملة
class ClassName {
constructor() { ... }
}
مثال
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
}
ينشئ المثال أعلاه فئة تسمى "سيارة".
يحتوي الفصل على خاصيتين أوليتين: "الاسم" و "السنة".
فئة JavaScript ليست كائنًا.
إنه قالب لكائنات جافا سكريبت.
باستخدام الفصل
عندما يكون لديك فصل ، يمكنك استخدام الفصل لإنشاء كائنات:
مثال
let myCar1 = new Car("Ford", 2014);
let myCar2 = new Car("Audi", 2019);
يستخدم المثال أعلاه فئة السيارة لإنشاء كائنين للسيارة .
يتم استدعاء طريقة المُنشئ تلقائيًا عند إنشاء كائن جديد.
طريقة المنشئ
طريقة الباني هي طريقة خاصة:
- يجب أن يكون لها الاسم الدقيق "المُنشئ"
- يتم تنفيذه تلقائيًا عند إنشاء كائن جديد
- يتم استخدامه لتهيئة خصائص الكائن
إذا لم تحدد طريقة منشئ ، فستضيف JavaScript طريقة مُنشئ فارغة.
طرق الفصل
يتم إنشاء طرق الفئة بنفس بناء الجملة مثل طرق الكائن.
استخدم الكلمة الأساسية classلإنشاء فصل دراسي.
أضف طريقة دائمًا constructor().
ثم أضف أي عدد من الطرق.
بناء الجملة
class ClassName {
constructor() { ... }
method_1() { ... }
method_2() { ... }
method_3() { ... }
}
إنشاء طريقة فئة باسم "العمر" ، والتي تُرجع عمر السيارة:
مثال
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
age() {
let date = new Date();
return date.getFullYear() - this.year;
}
}
let myCar = new Car("Ford", 2014);
document.getElementById("demo").innerHTML =
"My car is " + myCar.age() + " years old.";
يمكنك إرسال المعلمات إلى أساليب الفصل الدراسي:
مثال
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
age(x) {
return x - this.year;
}
}
let date = new Date();
let year = date.getFullYear();
let myCar = new
Car("Ford", 2014);
document.getElementById("demo").innerHTML=
"My car is
" + myCar.age(year) + " years old.";
دعم المتصفح
يحدد الجدول التالي إصدار المستعرض الأول مع الدعم الكامل للفئات في JavaScript:
| Chrome 49 | Edge 12 | Firefox 45 | Safari 9 | Opera 36 |
| Mar, 2016 | Jul, 2015 | Mar, 2016 | Oct, 2015 | Mar, 2016 |
"استخدام صارم"
يجب كتابة بناء الجملة في الفصول الدراسية في "الوضع المتشدد".
ستحصل على خطأ إذا لم تتبع قواعد "الوضع المتشدد".
مثال
في "الوضع المتشدد" ستحصل على خطأ إذا استخدمت متغيرًا دون التصريح به:
class Car {
constructor(name, year) {
this.name = name;
this.year = year;
}
age() {
// date = new Date(); // This will not work
let date = new Date(); // This will work
return date.getFullYear() - this.year;
}
}
تعرف على المزيد حول "الوضع المقيد" في: JS Strict Mode .