Lidhja e kontekstit përmes metodës bind në JavaScript

Metoda tjetër bind lejon që konteksti të lidhet përgjithmonë me një funksion. Si rezultat, kjo metodë kthen një funksion të ri, brenda të cilit this do të ketë një vlerë të caktuar të patundshme.

Le të shohim një shembull.

Le të themi se kemi një input:

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

Le të themi se lidhja me këtë input është e ruajtur në variablin elem:

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

Le të themi se kemi edhe funksionin e mëposhtëm func:

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

Le të përdorim bind për të krijuar një funksion të ri, i cili do të jetë kopje e funksionit func, por this brenda tij do të jetë gjithmonë i barabartë me elem:

let newFunc = func.bind(elem);

Tani në variablin newFunc gjendet një funksion. Le ta therasim atë, duke kaluar në parametrin e parë '1', dhe në të dytin '2' (përkujtoj, në elem gjendet një input me value të barabartë me 'text'):

newFunc('1', '2');

Le të bashkojmë gjithçka së bashku:

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

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

let newFunc = func.bind(elem);
newFunc('1', '2'); // do të shfaqet 'text12'

Nuk është e detyrueshme që rezultati i punës së bind të ruhet në një funksion të ri newFunc, thjesht mund të rishkruhet func. Pas kësaj, func do të jetë i njëjti funksion si më parë, por me this të lidhur fort:

func = func.bind(elem);

Le të themi se jepet kodi i mëposhtëm:

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

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

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

// këtu shkruani konstruksionin me bind()

func('John', 'Smit'); // këtu duhet të dalë 'hello, John Smit'
func('Eric', 'Luis'); // këtu duhet të dalë 'hello, Eric Luis'

Shkruani në vendin e treguar konstruksionin me metodën bind në mënyrë që this brenda funksionit func të tregojë gjithmonë te inputi nga ndryshorja elem.