Objekat this u JavaScriptu

Sada ćemo raditi sa posebnim objektom this, dostupnim u funkciji-rukovaocu događaja. Ovaj objekat ukazuje na element u kojem se događaj desio.

Objekt this je zgodan kada su element, u kojem se događaj desio, i element, sa kojim se preduzimaju akcije kao rezultat događaja, - to isti onaj element.

Na primer, ako imamo input, možemo da mu vezujemo rukovaoca gubljenja fokusa i po nastupanju tog događaja nešto uradimo sa tekstom inputa. Hajde da uradimo opisano. Neka nam je dat input:

html<input id="elem" value="text">

Hajde da dobijemo referencu na njega u promenljivu elem:

javascriptlet elem = document.querySelector('#elem');

Vezujmo za njega funkciju-rukovaoca događaja blur:

javascriptelem.addEventListener('blur', func);

Unutar ove funkcije func biće dostupan objekat this, koji ukazuje na naš input:

javascriptfunction func() {
  console.log(this); // sadrži referencu na naš element
}

Ispišimo sadržaj atributa value našeg inputa:

javascriptfunction func() {
  console.log(this.value); // ispisaćemo sadržaj atributa
}

Pa, a sada upišimo u input neki tekst:

javascriptfunction func() {
  this.value = '!!!';
}

Može se koristiti i anonimna funkcija:

javascriptelem.addEventListener('blur', function() {
  this.value = '!!!';
});