Kaip galima pakeisti objekto kontekstą JavaScript'e…

Yra keletas pagrindinių būdų keisti objekto kontekstą (this) JavaScript:

call(): Vykdo funkciją su nurodytu kontekstu ir argumentais, perduodamais atskirai.

// Pavyzdys su call()
const obj = { reikšmė: 42 };
function parodykReikšmę() {
    console.log(this.reikšmė);
}
parodykReikšmę.call(obj); // Išves 42

apply(): Vykdo funkciją su nurodytu kontekstu ir argumentais, perduodamais kaip masyvas arba pseudo-masyvas.

// Pavyzdys su apply()
const obj = { reikšmė: 100 };
function sudėti(a, b) {
    console.log(this.reikšmė + a + b);
}
sudėti.apply(obj, [5, 10]); // Išves 115

bind(): Grąžina naują funkciją, kurios kontekstas yra nustatytas į nurodytą objektą. Originali funkcija nėra iškviečiama nedelsiant.

// Pavyzdys su bind()
const obj = { reikšmė: 200 };
function pasveikinti() {
    console.log("Sveiki iš " + this.reikšmė);
}
const sukonfigūruotasPasveikinti = pasveikinti.bind(obj);
sukonfigūruotasPasveikinti(); // Išves "Sveiki iš 200"

Raketinės funkcijos (=>): Neturi savo this konteksto. Jos paveldi kontekstą iš leksikinės aplinkos, kurioje buvo apibrėžtos.

// Pavyzdys su raketinėmis funkcijomis
const obj = {
  reikšmė: "objektas",
  parodytiReikšmę: function() {
    const raketFunkcija = () => {
      console.log("Iš raketinės funkcijos: " + this.reikšmė); // this nurodo į obj
    }
    raketFunkcija();
  }
};
obj.parodytiReikšmę(); // Išves "Iš raketinės funkcijos: objektas"

Kviečiant kaip objekto metodą: Kai funkcija kviečiama kaip objekto metodas (obj.metodas()), this kontekstas tampa pats objektas (obj).

// Pavyzdys kaip metodo kvietimas
const obj = {
    reikšmė: "objekto metodas",
    parodyti: function() {
        console.log(this.reikšmė);
    }
};
obj.parodyti(); // Išves "objekto metodas"

Kviečiant kaip konstruktorių (new): Naudojant new operatorių, kuriant naują objekto egzempliorių, this kontekstas konstruktorio viduje nurodo į kuriamą egzempliorių.

// Pavyzdys su konstruktoriu
function MyObject(reikšmė) {
    this.reikšmė = reikšmė; // this nurodo į naują egzempliorių
}
const egzempliorius = new MyObject("konstruktorius");
console.log(egzempliorius.reikšmė); // Išves "konstruktorius"

Šie būdai leidžia valdyti, į ką nurodo raktinis žodis this funkcijos viduje, kas yra labai svarbu teisingai dirbant su objektais ir metodais JavaScript.

Kaip galima pakeisti objekto kontekstą JavaScript'e?