متدها و کلمه کلیدی this

مقدمه

در دو درس قبلی با مفهوم Object و ماهیت ارجاعی بودن اشیاء آشنا شدیم. حالا می‌خواهیم اشیاء را به سطح بالاتری برسانیم: اینکه بتوانند "عمل" انجام دهند! در جاوااسکریپت، اشیاء فقط برای نگهداری داده نیستند. اگر بخواهید یک عملیات خاص را مستقیماً روی شیء تعریف کنید (مثلاً معرفی خودکار کاربر)، باید متد برای آن تعریف کنید. در این درس با مفهوم متد و رفتار کلمه کلیدی this آشنا می‌شویم و می‌بینیم چگونه این دو مفهوم، برنامه‌نویسی شی‌گرا را در جاوااسکریپت ممکن می‌کنند.

تعریف متد و رفتار this در اشیاء

متدها، توابعی هستند که به عنوان یک پراپرتی در شیء قرار می‌گیرند. یعنی شما می‌توانید هر تابعی را به عنوان یک عضو شیء تعریف کنید تا همان شیء، یک رفتار یا عملیات خاص داشته باشد. برای این کار کافی است مقدار یک پراپرتی را برابر یک تابع قرار دهید.

به عبارت دیگر، متدها مثل هر پراپرتی معمولی، به شیء اضافه می‌شوند؛ با این تفاوت که مقدارشان تابع است. برای مثال، می‌خواهیم یک متد معرفی ساده برای شیء user تعریف کنیم.

JAVASCRIPT

let user = {
  name: "Ali",
  age: 30,
  sayHi: function() {
    console.log(Hello, My name is + this.name);
  }
};
user.sayHi(); //  Hello, My name is Ali

متد sayHi مثل یک پراپرتی معمولی به شیء اضافه شده است و با صدا زدن آن، پیغام معرفی کاربر نمایش داده می‌شود.

کلمه کلیدی this و کاربرد آن

درون هر متد، کلمه کلیدی this به همان شیء فعلی اشاره دارد. یعنی اگر از this برای دسترسی به یک پراپرتی استفاده کنید، منظور دقیقاً همان شیء است که متد روی آن اجرا شده. این ویژگی باعث می‌شود متدها بتوانند به تمام اطلاعات داخلی شیء دسترسی داشته باشند و برای هر شیء مشابه مجدداً قابل استفاده باشند.

JAVASCRIPT

let car = {
  brand: "Toyota",
  show: function() {
    console.log("This is a" + this.brand + " car.");
  }
};
car.show(); // This is a Toyota car.

استفاده از this باعث می‌شود که همین متد را برای هر شیء دیگری بتوانیم به سادگی بازنویسی کنیم.

رفتار this در شرایط مختلف

مقدار this بستگی به نحوه صدا زدن تابع دارد، نه محل تعریف آن. اگر تابع را به عنوان متد شیء صدا بزنید، this به همان شیء اشاره می‌کند. اما اگر همان تابع را جدا کنید و به طور مستقل صدا بزنید، مقدار this دیگر آن شیء نخواهد بود (در حالت strict مقدار undefined و در حالت عادی، شیء Global).

JAVASCRIPT

let user = {
  name: "Sara",
  sayHi: function() {
    console.log(this.name);
  }
};
let func = user.sayHi;
func(); // undefined (strict mode)

این نکته بسیار مهم است و یکی از دلایل اصلی خطاهای رایج هنگام کار با متدها و this محسوب می‌شود.

تعریف متد با سینتکس کوتاه ES6

در نسخه‌های جدید جاوااسکریپت، می‌توانید متد را با سینتکس کوتاه‌تر و خواناتر تعریف کنید (بدون کلمه کلیدی function). این کار در مثال زیر انجام شده است.

JAVASCRIPT

let user = {
  name: "Lale",
  sayHi() {
    console.log("Hello " + this.name);
  }
};
user.sayHi(); // Hello Lale

این روش فقط برای تعریف متد در شیء استفاده می‌شود و باعث خواناتر شدن کدتان خواهد شد.

متدها به شما اجازه می‌دهند اشیاء پویا و کاربردی بسازید که نه‌تنها داده، بلکه رفتار را هم در خود دارند. کلمه کلیدی this دسترسی به داده‌های داخلی همان شیء را داخل متدها ممکن می‌کند. فقط دقت کنید که this همواره به نحوه صدا زدن تابع وابسته است و نه محل تعریف تابع!

در درس بعد با مفهوم سازنده‌ها (constructor) و عملگر new آشنا خواهیم شد.