آموزش برنامه نویسی جاوااسکریپت-جلسه بیست و هشتم

JS Classes

Class intro

کلاس در واقع همان شی هست منتهی گسترده تر است . داخل کلاس می توان آبجکت های مختلفی داشت. روی کلاس می توان متد های مختلفی را پیاده کرد. آبجکت ها محدودت هستند و در واقع خلاصه ای از کلاس ها هستند.
Syntax
class ClassName {
 constructor() { … }
}

اسم کلاس با حرف بزرگ شروع می شود و حتما باید برای کلاس constructor بسازیم.

بعد خصوصیات رو فراخوانی می کنیم .

برای تعریف یک نمونه جدید از کلاس به صورت زیر عمل می کنیم :

let myCar1 = new Car(“Ford”, 2014);
let myCar2 = new Car(“Audi”, 2019);

در اینجا دو تا نمونه از کلاس درست کردیم که برای صفتهای تعریف شده مقدار می گیرند.

پیشنهاد ویژه: آموزش رایگان جاوااسکریپت

می توانیم برای کلاس متد هم بنویسیم:

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.”;

متد age در اینجا تاریخ مبدا را می گیرد و از سال تولید ماشین کم میکند تا بتوانیم سن ماشین را برگردانیم.

Class Inheritance

ارث بری یعنی ما یک سری خصوصیات رو از شی والد به ارث بردیم و یک سری خصوصیات هم مخصوص خودمان است.

مثلا ما یک والد داریم به نام Car براش سازنده تعریف می کنیم و داخل سازنده خصوصیت brand رو که خصوصیت به ارث برده شده است  وارد میکنیم حالا من بخوام مدل ماشین رو هم برگردونه دوباره یک کلاس تعریف میکنم برای مدل، و برای این کلاس هم یک سازنده تشکیل می دهم حالا داخل سازنده هم مدل و هم برند رو وارد میکنم . داخل این کلاس خصوصیت مخصوص یعنی همان مدل را از والد مجزا می کنم و قبل از صفت به ارث برده شده از والد  super را می نویسیم تا  به بالادستی خودش بره . ولی صفت مخصوص خودش را داخل خود کلاسش فراخوانی می کنیم .برای برگرداندن ویژگی ها هم از متد ها استفاده می کنیم .

class Car {
 constructor(brand) {
   this.carname = brand;
 }
 present() {
   return ‘I have a ‘ + this.carname;
 }
}
class Model extends Car {
 constructor(brand, mod) {
   super(brand);
   this.model = mod;
 }
 show() {
   return this.present() + ‘, it is a ‘ + this.model;
 }
}
let myCar = new Model(“Ford”, “Mustang”);
document.getElementById(“demo”).innerHTML = myCar.show();