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:

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

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

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

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

function 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:

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

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

Bir fonksiyon verilmiştir:

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

Üç input verilmiştir:

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

call metodu ve func fonksiyonunu kullanarak her bir inputun value değerini ekrana yazdırın.