JavaScript'те bind методу менен контекстти байлоо

Кийинки метод bind функцияга контекстти түбөлүккө байлоого мүмкүндүк берет. Бул метод өзүнүн натыйжасында жаңы функцияны кайтарат, анын ичиндеги this тыгыз берилген мааниге ээ болот.

Келгиле, мисалда көрөлү.

Бизде инпут бар деп коёлу:

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

Бул инпутко шилтеме өзгөрмө elemго жазылсын:

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

Бизде төмөнкү функция func да бар деп коёлу:

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

Келгиле, bind жардамы менен func функциясынын көчүрмөсү болгон, бирок андагы this ар дайым elemга барабар болгон жаңы функция жасайлы:

let newFunc = func.bind(elem);

Эми newFunc өзгөрмөсүндө функция жатат. Келгиле, аны чакыралы, биринчи параметрге '1', экинчисине '2' өткөрүп (эске сала кетейин, elem'де value'sу 'text'га барабар болгон инпут жатат):

newFunc('1', '2');

Келгиле, баарын чогултуп көрөлү:

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

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

let newFunc = func.bind(elem);
newFunc('1', '2'); // 'text12' чыгарат

bind ишинен чыккан натыйжаны жаңы функцияга newFunc жазуу зарыл эмес, жөн гана funcты кайра жаза аласыз. Андан кийин func мурунку сыяктуу эле функция болот, бирок тыгыз байланган this менен:

func = func.bind(elem);

Төмөнкү код берилди деп коёлу:

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

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

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

// бул жерге bind() менен курулуш жазыңыз

func('John', 'Smit'); // бул жерде 'hello, John Smit' чыгышы керек
func('Eric', 'Luis'); // бул жерде 'hello, Eric Luis' чыгышы керек

Көрсөтүлгөн жерге bind методу менен курулуш жазыңыз, ошондо func функциясынын ичиндеги this ар дайым elem өзгөрмөсүнөн инпутка тиешелүү болот.