کلمه کلیدی This در JS

قبلی بعدی

const person = {
  firstName: "Ehsan",
  lastName : "Eslami",
  id       : 5566,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};

کلمه کلیدی This چیست؟

در JavaScript، کلمه کلیدی This، به یک شیء اشاره دارد.

کلمه کلیدی This بسته به نحوه استفاده از آن، به اشیاء مختلف اشاره دارد:

در یک متد شیء، This به شی اشاره دارد.
به تنهایی، This به شیء جهانی اشاره دارد.
در یک تابع ، This به شیء جهانی اشاره دارد.
در یک تابع، در حالت سخت، This تعریف نشده است.
در یک رویداد، This به المانی اشاره دارد که رویداد را دریافت کرده است.
متدهایی مانند ()call() ،apply و ()bind می توانند This را به هر شیء ارجاع دهند.

نکته: This یک متغیر نیست، بلکه یک کلمه کلیدی است. ما نمی توانیم ارزش This را تغییر دهیم.

This در یک متد

هنگامی که در یک متد شیء استفاده می شود، This به شیء اشاره دارد.

در مثال اول این صفحه، This به شیء شخص اشاره دارد، زیرا متد fullName، متدی از شیء شخص است.

fullName : function() {
  return this.firstName + " " + this.lastName;
}

This به تنهایی

هنگامی که به تنهایی استفاده می شود، This به شی جهانی اشاره دارد، زیرا This در محدوده جهانی اجرا می شود.

در یک پنجره مرورگر، شی سراسری [object Window] است:

let x = this;

در حالت سخت، هنگامی که به تنهایی استفاده می شود، This به شی جهانی نیز اشاره دارد:

"use strict";
let x = this;

This در یک تابع (پیش فرض)

در یک تابع، شیء جهانی، اتصال پیش فرض برای This است.

در یک پنجره مرورگر، شیء سراسری [object Window] است:

function myFunction() {
  return this;
}

This در یک تابع (حالت سخت)

حالت سخت JavaScript اجازه اتصال پیش فرض را نمی دهد.

بنابراین، هنگامی که در یک تابع استفاده می شود، This در حالت سخت تعریف نشده است.

"use strict";
function myFunction() {
  return this;
}

This در کنترل کننده های رویداد

در کنترل کننده های رویداد HTML، کلمه کلیدی This به المان HTML اشاره دارد که رویداد را دریافت کرده است:

<button onclick="this.style.display='none'">
  کلیک کنید تا من حذف شوم!
</button>

اتصال متد شیء

در مثال های زیر، This، شیء شخص است:

const person = {
  firstName  : "Ehsan",
  lastName   : "Eslami",
  id         : 5566,
  myFunction : function() {
    return this;
  }
};

const person = {
  firstName: "Ehsan",
  lastName : "Eslami",
  id       : 5566,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};

اتصال تابع صریح

متدهای ()call و ()apply، متدهای از پیش تعریف شده JavaScript هستند.

هر دو می توانند برای فراخوانی یک متد شیء، با استفاده از شیء دیگر به عنوان آرگومان استفاده شوند.

مثال زیر person1.fullName را با person2 به عنوان آرگومان فراخوانی می کند، این به person2 اشاره دارد، حتی اگر fullName یک متد person1 باشد:

const person1 = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}

const person2 = {
  firstName:"Ehsan",
  lastName: "Eslami",
}

// Return "Ehsan Eslami":
person1.fullName.call(person2);

قرض گرفتن تابع

با متد ()bind ، یک شیء می تواند متدی را از شیء دیگری قرض بگیرد.

این مثال، دو شیء (شخص و عضو) ایجاد می کند.

شیء عضو، متد نام کامل را از شیء شخص، قرض می گیرد:

const person = {
  firstName:"diba",
  lastName: "Jalali",
  fullName: function () {
    return this.firstName + " " + this.lastName;
  }
}

const member = {
  firstName:"Ehsan",
  lastName: "Eslami",
}

let fullName = person.fullName.bind(member);

خلاصه درس

در این درس با کلمه کلیدی This در JavaScript:

کلمه کلیدی This چیست؟
This در یک متد
This به تنهایی
This در یک تابع (پیش فرض)
This در یک تابع (حالت سخت)
This در کنترل کننده های رویداد
اتصال متد شیء
اتصال تابع صریح
قرض گرفتن تابع

آشنا شدیم.

خلاصه ای از کلمه کلیدی This

1. در یک متد شیء، this به شی اشاره دارد.

2. به تنهایی، this به شیء جهانی اشاره دارد.

3. در یک تابع ، this به شیء جهانی اشاره دارد.

4. در یک تابع، در حالت سخت، this تعریف نشده است.

5. در یک رویداد، this به المانی اشاره دارد که رویداد را دریافت کرده است.

6. متدهایی مانند ()call() ،apply و ()bind می توانند this را به هر شیء ارجاع دهند.

تمرین

مشاهده پاسخ

قبلی بعدی

توسعه دهندگان

دیبا جلالی