JavaScript'te this Nesnesi

Şimdi, olay işleyici fonksiyonunda erişilebilen özel this nesnesi üzerinde çalışacağız. Bu nesne, olayın meydana geldiği elementi gösterir.

this nesnesi, olayın meydana geldiği element ile olay sonucunda işlem yapılan element aynı olduğunda kullanışlıdır.

Örneğin, bir inputumuz varsa, ona bir odak kaybı (blur) işleyicisi bağlayabilir ve bu olay gerçekleştiğinde inputun metniyle bir şeyler yapabiliriz. Anlatılanı yapalım. Bir inputumuz olduğunu varsayalım:

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

Onu bir elem değişkenine atayalım:

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

Ona bir blur olayı işleyici fonksiyonu bağlayalım:

javascriptelem.addEventListener('blur', func);

Bu func fonksiyonunun içinde, inputumuzu gösteren this nesnesine erişilebilir olacak:

javascriptfunction func() {
  console.log(this); // elementimize bir referans içerir
}

Inputumuzun value özniteliğinin içeriğini yazdıralım:

javascriptfunction func() {
  console.log(this.value); // özniteliğin içeriğini yazdıralım
}

Şimdi, inputa bir metin yazalım:

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

Anonim fonksiyon da kullanılabilir:

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