در جاوااسکریپت، کلیدواژه this یکی از مفاهیم مهم و گاهی پیچیده است که بسته به شرایط خاص خود رفتار متفاوتی از خود نشان می‌دهد. به طور کلی، this به شیء‌ای اشاره می‌کند که در حال حاضر به آن دسترسی داریم و می‌خواهیم ویژگی‌ها یا متدهای آن را استفاده کنیم. دلیل پیچیدگی این موضوع، روش‌های گوناگون استفاده از this است که به زمینه‌ای که در آن به کار می‌رود، بستگی دارد.
برای مثال، در یک تابع گلوبال یا به‌سادگی در سطح یک اسکریپت، this به شیء window اشاره می‌کند. این بدان معناست که اگر شما در سطح بالا کدی به شکل زیر داشته باشید، this برابر window خواهد بود:
function myFunction() {\r\n console.log(this);\r\n}\r\nmyFunction();در کد بالا، console.log(this); خروجی‌ای برابر window در محیط مرورگر خواهد داشت. زمینه‌ای که this در آن استفاده می‌شود، بر اساس نحوه فراخوانی تابع تغییر می‌کند.
حالا بیایید به مثال دیگری بپردازیم: در یک شیء خاص، this به خود آن شیء اشاره می‌کند. زمانی که ما یک متد تعریف می‌کنیم، می‌توانیم this را برای دسترسی به متغیرهای آن شیء استفاده کنیم.
const person = {\r\n name: 'Ali',\r\n greet: function() {\r\n console.log(`Hello, my name is ${this.name}`);\r\n }\r\n};\r\nperson.greet();اینجا this.name به Ali اشاره می‌کند و خروجی "Hello, my name is Ali" خواهد بود. این به این دلیل است که greet به عنوان متدی از person فراخوانی شده‌است.
در نهایت، استفاده از this در کلاس‌ها که یکی از ویژگی‌های برجسته ES6 هستند، معمول است. در کلاس‌ها، this در متدهای تعریف شده به شیء خاصی که توسط آن کلاس ساخته شده، اشاره می‌کند. در زیر مثالی از نحوه استفاده از this در کلاس‌ها آمده است:
class Car {\r\n constructor(make, model) {\r\n this.make = make;\r\n this.model = model;\r\n }\r\n displayInfo() {\r\n console.log(`This car is a ${this.make} ${this.model}`);\r\n }\r\n}\r\nconst myCar = new Car('Toyota', 'Corolla');\r\nmyCar.displayInfo();کلاس Car شامل یک متد displayInfo است و از this برای دسترسی به ویژگی‌های make و model استفاده می‌کند. نمونه‌گیری از کلاس Car و سپس فراخوانی متد displayInfo خروجی "This car is a Toyota Corolla" خواهد داشت.
توضیح کد خط به خط
function myFunction() { <- تعریف یک تابع در سطح گلوبالconsole.log(this); <- چاپ مقدار this که برابر window است} <- پایان تابعmyFunction(); <- فراخوانی تابع به صورت گلوبال و چاپ windowconst person = { <- تعریف یک شیء بنام personname: 'Ali', <- تعریف یک ویژگی به نام name با مقدار Aligreet: function() { <- تعریف یک متد به نام greetconsole.log(`Hello, my name is ${this.name}`); <- دسترسی به ویژگی name و چاپ نام} <- پایان متد}; <- پایان شیءperson.greet(); <- فراخوانی متد greet و چاپ پیغامclass Car { <- تعریف یک کلاس به نام Carconstructor(make, model) { <- تعریف سازنده کلاس this.make = make; <- انتساب make به this.makethis.model = model; <- انتساب model به this.model} <- پایان سازندهdisplayInfo() { <- تعریف متد displayInfoconsole.log(`This car is a ${this.make} ${this.model}`); <- دسترسی به ویژگی‌ها و چاپ اطلاعات} <- پایان متد} <- پایان کلاسconst myCar = new Car('Toyota', 'Corolla'); <- ایجاد نمونه‌ای از کلاس CarmyCar.displayInfo(); <- فراخوانی متد displayInfo و نمایش اطلاعات خودرو