Povezovanje konteksta z metodo bind v JavaScript

Naslednja metoda bind omogoča trajno povezovanje konteksta s funkcijo. Kot rezultat ta metoda vrne novo funkcijo, znotraj katere bo this imel togo določeno vrednost.

Poglejmo si primer.

Recimo, da imamo vnosno polje:

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

Recimo, da je povezava do tega vnosnega polja shranjena v spremenljivko elem:

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

Recimo, da imamo tudi naslednjo funkcijo func:

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

Uporabimo bind za ustvarjanje nove funkcije, ki bo kopija funkcije func, vendar bo this v njej vedno enak elem:

javascriptlet newFunc = func.bind(elem);

Zdaj v spremenljivki newFunc leži funkcija. Pokličimo jo in podajmo prvi parameter '1' in drugi '2' (opomnik: v elem leži vnosno polje z value, enakim 'text'):

javascriptnewFunc('1', '2');

Povežimo vse skupaj:

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

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

let newFunc = func.bind(elem);
newFunc('1', '2'); // izpiše 'text12'

Ni nujno, da rezultat delovanja bind zapišemo v novo funkcijo newFunc, lahko preprosto prepišemo func. Po tem bo func enaka funkcija kot prej, vendar s togo povezanim this:

javascriptfunc = func.bind(elem);

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

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

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

// tukaj napišite konstrukcijo z bind()

func('John', 'Smit'); // tukaj naj izpiše 'hello, John Smit'
func('Eric', 'Luis'); // tukaj naj izpiše 'hello, Eric Luis'