Објекат this у JavaScript-у

Сада ћемо радити са специјалним објектом this, доступним у функцији-руковаоцу догађаја. Овај објекат указује на елемент у коме се догодио догађај.

Објекат this је погодан када су елемент у коме се догодио догађај и елемент са којим се предузимају радње као последица догађаја - исти тај елемент.

На пример, ако имамо уносно поље (инпут), можемо му прикључити руковаоца губитка фокуса и при наступању тог догађаја нешто урадити са текстом инпута. Хајде да направимо описано. Нека нам је дат инпут:

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

Хајде да добијемо референцу на њега у променљиву elem:

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

Прикључимо му функцију-руковаоца догађаја blur:

javascriptelem.addEventListener('blur', func);

Унутар ове функције func биће доступан објекат this, који указује на наш инпут:

javascriptfunction func() {
  console.log(this); // садржи референцу на наш елемент
}

Прикажимо садржај атрибута value нашег инпута:

javascriptfunction func() {
  console.log(this.value); // приказујемо садржај атрибута
}

Па, а сада упишимо у инпут неки текст:

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

Може се користити и анонимна функција:

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