کلمه کلیدی this در جاوااسکریپت
یکی از مفاهیم چالش‌برانگیز و در عین حال قدرتمند در جاوااسکریپت، کلمه کلیدی this است. این کلمه بسته به context اجرای کد، می‌تواند به اشیاء مختلفی اشاره کند و درک صحیح آن برای توسعه‌دهندگان ضروری است.
درک رفتار this مانند داشتن کلید حل معمای scope و context در جاوااسکریپت است.
مقادیر مختلف this در شرایط مختلف
| شرایط اجرا |
مقدار this |
| در تابع عادی |
شیء global (window در مرورگر) |
| در متد شیء |
خود شیء مالک متد |
| با استفاده از new |
نمونه جدید ایجاد شده |
| در رویدادها |
عنصر دریافت‌کننده رویداد |
مثال‌های کاربردی
برای درک بهتر، به این مثال‌ها توجه کنید:
- متد شیء:
const person = {
name: "علی",
greet() { console.log(this.name); }
};
person.greet(); // خروجی: "علی"
- تابع عادی:
function test() {
console.log(this);
}
test(); // در مرورگر: window
کنترل مقدار this
گاهی نیاز داریم مقدار this را به صورت دستی تنظیم کنیم. برای این کار می‌توانیم از متدهای زیر استفاده کنیم:
- bind(): ایجاد تابع جدید با this ثابت
- call(): فراخوانی تابع با this و آرگومان‌های مشخص
- apply(): مشابه call اما با آرگومان‌های آرایه
برای یادگیری عمیق‌تر این مفاهیم، می‌توانید از آموزش‌های تخصصی در مکث شاپ استفاده کنید.
نکات کلیدی
در کار با this به این موارد توجه ویژه داشته باشید:
- مقدار this در arrow function با تابع عادی متفاوت است
- در strict mode، this در توابع عادی undefined می‌شود
- می‌توان با استفاده از الگوی Factory یا Class این رفتار را مدیریت کرد
