JavaScript-də bind metodu ilə kontekstin bağlanması

Növbəti metod bind konteksti funksiyaya həmişəlik bağlamağa imkan verir. Bu metod öz nəticəsi olaraq yeni bir funksiya qaytarır, onun daxilində this sərt şəkildə təyin edilmiş qiymətə malik olacaq.

Gəlin nümunə üzərində baxaq.

Tutaq ki, bizim bir inputumuz var:

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

Tutaq ki, bu inputa istinad dəyişəndə elem yazılıb:

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

Tutaq ki, bizim həmçinin aşağıdakı funksiyamız var func:

function func(param1, param2) {
	console.log(this.value + param1 + param2);
}

Gəlin bind köməyi ilə yeni funksiya düzəldək, hansı ki, func funksiyasının surəti olacaq, amma this onun daxilində həmişə elem bərabər olacaq:

let newFunc = func.bind(elem);

İndi newFunc dəyişənində funksiya yerləşir. Gəlin onu çağıraq, birinci parametrə '1', ikinciyə isə '2' ötürək (xatırladım ki, elem-də value-sü 'text' olan input yerləşir):

newFunc('1', '2');

Gəlin hamısını bir yerə yığaq:

let elem = document.getElementById('elem');

function func(param1, param2) {
	console.log(this.value + param1 + param2);
}

let newFunc = func.bind(elem);
newFunc('1', '2'); // çıxardacaq 'text12'

bind işinin nəticəsini yeni funksiyada newFunc yazmaq mütləq deyil, sadəcə func-i yenidən yaza bilərsiniz. Bundan sonra func əvvəl olduğu kimi eyni funksiya olacaq, amma sərt bağlanmış this ilə:

func = func.bind(elem);

Tutaq ki, aşağıdakı kod verilib:

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

let elem = document.getElementById('elem');

function func(name, surname) {
	console.log(this.value + ', ' + name + ' ' + surname);
}

// bura bind() ilə konstruksiya yazın

func('John', 'Smit'); // bura çıxarmalıdır 'hello, John Smit'
func('Eric', 'Luis'); // bura çıxarmalıdır 'hello, Eric Luis'

Göstərilən yerdə bind metodu ilə konstruksiya yazın ki, func funksiyasının daxilində this həmişə elem dəyişənindən olan inputu göstərsin.