offline version v3
Запись на курсы по HTML, CSS, JavaScript, PHP, фреймворкам и CMS,
а также: помощь в поиске работы и заказов, стажировка на реальных проектах→
⊗jsPmCxBM 441 of 503 menu

Привязывание контекста через метод bind в JavaScript

Следующий метод 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, равным '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 так, чтобы this внутри функции func всегда указывал на инпут из переменной elem.

enru