Objek this dalam JavaScript

Sekarang kita akan bekerja dengan objek khusus this, yang tersedia dalam fungsi-penangan peristiwa. Objek ini menunjuk ke elemen di mana peristiwa terjadi.

Objek this berguna ketika elemen, di mana peristiwa terjadi, dan elemen, yang dilakukan tindakan sebagai hasil dari peristiwa, adalah elemen yang sama.

Misalnya, jika kita memiliki input, kita dapat mengikatkan penangan kehilangan fokus padanya dan saat peristiwa itu terjadi, lakukan sesuatu dengan teks input. Mari kita lakukan hal yang dijelaskan. Anggaplah kita diberikan input:

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

Mari kita dapatkan referensi padanya dalam variabel elem:

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

Ikatkan fungsi-penangan peristiwa blur padanya:

javascriptelem.addEventListener('blur', func);

Di dalam fungsi func ini akan tersedia objek this, yang menunjuk ke input kita:

javascriptfunction func() {
  console.log(this); // berisi referensi ke elemen kita
}

Mari kita tampilkan isi dari atribut value input kita:

javascriptfunction func() {
  console.log(this.value); // tampilkan isi atribut
}

Nah, sekarang mari tuliskan beberapa teks ke input:

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

Bisa juga menggunakan fungsi anonim:

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