JavaScript'te call Metodu ile Bağlam Bağlama

Böylece, this'in aslında nasıl çalıştığını inceledik. Şimdi, bir fonksiyonun hangi bağlamda çağrıldığını (yani this'in neye eşit olduğunu) zorunlu olarak belirlememize izin veren metotları inceleyelim.

İnceleyeceğimiz ilk metot, call olarak adlandırılır. Çalışmasını bir örnek üzerinde görelim. Bir inputumuz olduğunu varsayalım:

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

Bu inputun referansını alalım ve elem değişkenine kaydedelim:

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

Şimdi func adında bir fonksiyon yapalım, içinde this.value'yi yazdıralım:

javascriptfunction func() {
  console.log(this.value);
}

Şu an fonksiyonumuz this'in neye referans verdiğini bilmiyor. Eğer onu addEventListener ile bağlasaydık, o zaman evet. Ama bunu yapmayacağız. Bunun yerine, fonksiyonumuzu çağırarak, this'in elem'e eşit olması gerektiğini söyleyeceğiz.

Bu şu şekilde yapılır: func.call(elem). Bu kod, fonksiyonun basit bir şekilde func() şeklinde çağrılmasına eşdeğerdir, sadece this'in elem'e eşit olması koşuluyla.

Böylece, call metodunun sözdizimi şöyledir: fonksiyon.call(nesne). Hepsini bir araya getirelim:

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

function func() {
  console.log(this.value); // inputun value değerini yazdırır
}
func.call(elem);

javascriptfunction func() {
  console.log(this.value);
}

html<input id="elem1" value="text1">
<input id="elem2" value="text2">
<input id="elem3" value="text3">