JavaScript-də this Obyekti

İndi biz hadisə işləyicisi funksiyasında əlçatan olan xüsusi this obyekti ilə işləyəcəyik. Bu obyekt hadisənin baş verdiyi elementə işarə edir.

this obyekti, hadisənin baş verdiyi element və nəticədə hərəkətlərin yerinə yetirildiyi element eyni olduqda əlverişlidir.

Məsələn, əgər bizim inputumuz varsa, ona fokus itkisi işləyicisi əlavə edə bilərik və bu hadisə baş verəndə inputun mətninə nəsə edə bilərik. Gəlin təsvir olunanı edək. Tutaq ki, bizə bir input verilib:

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

Gəlin onu elem dəyişəninə istinad edək:

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

Ona blur hadisəsinin funksiya-işləyicisini əlavə edək:

elem.addEventListener('blur', func);

Bu func funksiyasının daxilində bizim inputa işarə edən this obyekti əlçatan olacaq:

function func() {
	console.log(this); // bizim elementə istinadı ehtiva edir
}

Gəlin inputumuzun value atributunun məzmununu çap edək:

function func() {
	console.log(this.value); // atributun məzmununu çap edirik
}

İndi isə inputa nəsə mətn yazaq:

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

Anonim funksiyadan da istifadə etmək olar:

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

Bir input verilib. Bu input fokus aldıqda onun içinə 1 rəqəmini yazın, fokus itirdikdə isə 2 rəqəmini yazın. Funksiya-işləyicinin daxilində inputa müraciət etmək üçün this obyektindən istifadə edin.

Dəyəri 1 rəqəmi olan bir düymə verilib. Elə edin ki, bu düyməyə hər klikdə onun dəyəri birdən artırılsın.