Nuo ko priklauso `this` vykdymo konteksto reikšmė…

„this“ reikšmė JavaScript priklauso nuo funkcijos kvietimo būdo. Pagrindiniai scenarijai:

Pasaulinis kontekstas: Funkcijų išorėje, griežto režimo ('use strict') metu, this yra undefined. Be griežto režimo — globalus objektas (window naršyklėje, global Node.js).

Objekto metodo kvietimas: this nurodo į objektą, kuriam priklauso kviečiamas metodas.

const obj = {
  prop: 'reikšmė',
  method: function() {
    // this === obj
    console.log(this.prop);
  }
};
obj.method();

Įprastas funkcijos kvietimas: Griežto režimo metu this yra undefined. Be griežto režimo — globalus objektas.

function myFunction() {
  // griežto režimo metu this === undefined
  // be režimo this === window (naršyklėje)
  console.log(this);
}
myFunction();

Konstruktorius (new): Naudojant new su konstruktoriaus funkcija, this funkcijos viduje nurodo į naują sukurtą objektą.

function MyClass(name) {
  this.name = name; // this === naujas objektas
}
const instance = new MyClass('test');
// instance.name === 'test'

Aiškus susiejimas (call, apply, bind): Šie metodai leidžia aiškiai nustatyti this reikšmę funkcijai.
- call(thisArg, arg1, arg2, ...): kviečia funkciją, nustatydamas this į thisArg ir perduodamas argumentus atskirai.
- apply(thisArg, [argsArray]): kviečia funkciją, nustatydamas this į thisArg ir argumentus kaip masyvą.
- bind(thisArg): grąžina naują funkciją su nuolat susietu this reikšme.
```
const anotherObj = { value: 42 };
function showValue() {
  console.log(this.value);
}
showValue.call(anotherObj); // Išveda 42
```

Strėlinės funkcijos (=>): Strėlinės funkcijos neturi savo this. this reikšmė paveldima iš leksinio konteksto, kuriame ji buvo apibrėžta.

const outerObj = {
  name: 'Išorė',
  method: function() {
    const arrowFunc = () => {
      // this čia paveldima iš method, kuris kviečiamas kaip outerObj metodas
      console.log(this.name);
    };
    arrowFunc();
  }
};
outerObj.method(); // Išveda 'Išorė'

const anotherArrowFunc = () => {
    // this čia paveldima iš globalinio konteksto (arba `undefined` griežto režimo)
    console.log(this);
};
anotherArrowFunc();

DOM įvykių tvarkytojai: Daugeliu atvejų, this įvykių tvarkytojuose nurodo į DOM elementą, kuriame įvyko įvykis.

// Pavyzdys naršyklėje
const button = document.querySelector('button');
button.addEventListener('click', function() {
  // this === button
  console.log(this.tagName);
});

Šių mechanizmų supratimas yra labai svarbus teisingam this naudojimui JavaScript'e.

Nuo ko priklauso `this` vykdymo konteksto reikšmė JavaScript?