Везивање контекста методом 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.