متدهای نمونه - Instance methods

اگر یک کلاس فقط یک constructor داشته باشد، تفاوت چندانی با یک تابع کارخانه‌ای (Factory function) مثل createX که صرفاً اشیاء معمولی (Plain objects) می‌سازد، ندارد. با این حال، قدرت واقعی کلاس‌ها در این است که می‌توانند به عنوان «قالب‌ها» (Templates) عمل کنند و متدها را به طور خودکار به اینستنس‌ها اختصاص دهند.

برای مثال، در نمونه‌های کلاس Date، شما می‌توانید از مجموعه‌ای از متدها برای گرفتن اطلاعات مختلف از یک مقدار تاریخ واحد استفاده کنید؛ اطلاعاتی مثل سال، ماه، روزِ هفته و غیره. همچنین می‌توانید این مقادیر را از طریق متدهای همتای آن‌ها یعنی سری setX (مانند setFullYear) تغییر دهید و تنظیم کنید.

برای کلاس Color خودمان، می‌توانیم متدی به نام getRed اضافه کنیم که مقدار قرمزِ رنگ را برمی‌گرداند:

class Color {
  constructor(r, g, b) {
    this.values = [r, g, b];
  }
  getRed() {
    return this.values[0];
  }
}

const red = new Color(255, 0, 0);
console.log(red.getRed()); // خروجی: 255

اگر با قابلیت متدهای کلاس آشنا نباشید، شاید وسوسه شوید که تابع را در داخل خودِ متد سازنده تعریف کنید:

class Color {
  constructor(r, g, b) {
    this.values = [r, g, b];
    this.getRed = function () {
      return this.values[0];
    };
  }
}

این روش هم کار می‌کند. اما مشکل بزرگ اینجاست که با این کار، هر بار که یک نمونه از Color ساخته می‌شود، یک تابع کاملاً جدید در حافظه ایجاد می‌شود؛ حتی با اینکه همه‌ی آن‌ها دقیقاً یک کار یکسان را انجام می‌دهند!

console.log(new Color().getRed === new Color().getRed); // خروجی: false

در مقابل، اگر از ساختار استاندارد متد در کلاس استفاده کنید، آن متد بین تمام نمونه‌ها به اشتراک گذاشته می‌شود (Shared method). یک تابع می‌تواند بین همه اینستنس‌ها مشترک باشد، اما در عین حال وقتی اینستنس‌های مختلف آن را صدا می‌زنند رفتار متفاوتی نشان دهد؛ چرا که مقدار this در هر کدام متفاوت است.

اگر کنجکاو هستید بدانید این متد کجا ذخیره می‌شود: متدها روی پروتیپِ تمام اینستنس‌ها، یعنی Color.prototype تعریف می‌شوند که جزئیات بیشتر آن در بخش زنجیره پروتیپ آمده است.

به همین ترتیب، می‌توانیم متد جدیدی به نام setRed بسازیم که مقدار قرمزِ رنگ را تغییر داده و تنظیم کند:

class Color {
  constructor(r, g, b) {
    this.values = [r, g, b];
  }
  getRed() {
    return this.values[0];
  }
  setRed(value) {
    this.values[0] = value;
  }
}

const red = new Color(255, 0, 0);
red.setRed(0);
console.log(red.getRed()); // خروجی: 0 (البته در این مرحله، نام این رنگ دیگر باید "مشکی" باشد!)