Mi az a this a JavaScript-ben?

A this a JavaScript-ben egy kulcsszó, amely megadja egy függvény végrehajtási kontextusát. Értéke attól függ, hogyan hívják meg a függvényt.

Általában a this a globális objektumra mutat (a böngészőben window), egy normál függvényhívás esetén, kivéve szigorú módban.

Szigorú módban ('use strict') ugyanebben a szcenárióban a this undefined lesz.

Amikor egy objektum metódusát hívjuk, a this az objektumra mutat.

const obj = {
  method: function() {
    console.log(this); // obj
  }
};
obj.method();

Konstruktor hívásakor (new-del egy függvényt), a this az újonnan létrehozott példányra mutat.

function Constructor() {
  console.log(this); // Constructor példány
}
const instance = new Constructor();

A call, apply, bind metódusok használatakor a this kifejezetten az első argumentumként van beállítva.

function greet() {
  console.log(`Szia, ${this.name}!`);
}

const person = { name: 'Alicia' };

greet.call(person); // Szia, Alicia!
greet.apply(person); // Szia, Alicia!

const boundGreet = greet.bind(person);
boundGreet(); // Szia, Alicia!

Ívelt függvényekben (Arrow Functions) a this nem rendelkezik saját kontextussal. Lexikálisan öröklődik abból a környezetből, ahol definiálták.

const obj2 = {
  name: 'Bob',
  greet: function() {
    const arrowGreet = () => {
      console.log(`Szia ${this.name}-től!`); // this az obj2-re mutat
    };
    arrowGreet();
  }
};
obj2.greet(); // Szia Bob-tól!

const obj3 = {
  name: 'Charlie',
  greet: () => {
    console.log(`Szia ${this.name}-től!`); // this a window-ra (vagy undefined-re) mutat, nem az obj3-ra
  }
};
obj3.greet(); // Szia undefined-től! (vagy hiba)

A this kontextus nem mindig egyértelmű, különösen callback-ek vagy aszinkron műveletek esetén. A this szabályok megértése alapvető a JavaScript helyes működéséhez.