ترجمه‌ی کلاس‌ها در JavaScript

ECMAScript 2015، که به ES6 نیز معروف است، کلاس‌های JavaScript را معرفی کرده است.

کلاس‌های JavaScript قالبی از اشیای JavaScript هستند.

زبان JavaScript کلاسی

از کلیدواژه class استفاده کنید. class یک کلاس ایجاد کنید.

همیشه یک constructor() روش‌ها:

نحوه‌ی نوشتن

class ClassName {
  constructor() { ... }
}

مثال

class Car {
  constructor(name, year) {
    this.name = name;
    this.year = year;
  }
}

مثال بالا یک کلاس به نام "Car" ایجاد کرده است.

این کلاس دو ویژگی اولیه دارد: "name" و "year".

ترجمه‌ی کلاس‌ها در JavaScriptنیستشیء.

این یک شیء JavaScript استمدل.

با استفاده از کلاس

وقتی شما یک کلاس دارید، می‌توانید از آن برای ایجاد شیء استفاده کنید:

مثال

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

آزمایش کنید

مثال بالا از کلاس Carبرای ایجاد دو شیء Car.

در هنگام ایجاد شیء جدید به صورت خودکار روش constructor (constructor method) فراخوانی می‌شود.

روش constructor

روش constructor یک روش خاص است:

  • باید نام دقیق
  • در هنگام ایجاد شیء جدید به صورت خودکار اجرا می‌شود
  • برای تنظیم ویژگی‌های اولیه‌ی شیء استفاده می‌شود
  • اگر روش constructor را تعریف نکنید، JavaScript یک روش constructor خالی اضافه می‌کند.

روش‌های کلاس

نحوه‌ی نوشتن روش‌های کلاس با روش‌های شیء مشابه است.

با استفاده از کلیدواژه class یک کلاس ایجاد کنید.

همیشه روش constructor() را اضافه کنید.

سپس تعداد دلخواهی روش اضافه کنید.

نحوه‌ی نوشتن

class ClassName {
  constructor() { ... }
  method_1() { ... }
  method_2() { ... }
  method_3() { ... }
}

یک روش به نام "age" ایجاد کنید که سال خودرو را بازمی‌گرداند:

مثال

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 IE Firefox Safari Opera
Chrome 49 Edge 12 Firefox 45 Safari 9 Opera 36
مارس 2016 جولای 2015 مارس 2016 اکتبر 2015 مارس 2016

"use strict"

زبان نوشتاری کلاس باید با حالت سختگیرانه باشد.

اگر از قوانین حالت سختگیرانه پیروی نکنید، پیام خطا دریافت خواهید کرد.

مثال

در حالت سختگیرانه، اگر از متغیری استفاده کنید که نشده است، خطا می‌گیرید:

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 در اینجا بیشتر درباره "حالت سختگیرانه" یاد بگیرید.