Аб'ект 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 = '!!!';
});