Објектот this во JavaScript

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

Објектот this е погоден, кога елементот, во кој се случил настанот, и елементот, со кој се извршуваат дејствата како резултат на настанот, - тоа е истиот елемент.

На пример, ако имаме input, можеме да му прикачиме обработувач на губење на фокус и при случување на овој настан да направиме нешто со текстот на input. Ајде да го направиме опишаното. Нека ни е даден input:

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

Ајде да добиеме референца на него во променлива elem:

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

Да му прикачиме функција-обработувач на настан blur:

elem.addEventListener('blur', func);

Внатре во оваа функција func ќе биде достапен објектот this, кој покажува на нашиот input:

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

Да го испечатиме содржината на атрибутот value на нашиот input:

function func() {
	console.log(this.value); // ќе ја испечатиме содржината на атрибутот
}

Па, а сега да запишеме во input некој текст:

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

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

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

Даден е input. При добивање на фокус од овој input запишете во него број 1, а при губење на фокус - број 2. За пристапување до input внатре во функцијата-обработувач користете објект this.

Дадено е копче, чија вредност е број 1. Направете така што при клик на ова копче нејзината вредност секој пат да се зголемува за еден.