Везивање контекста преко методе call у JavaScript-у

Дакле, разјаснили смо како заправо ради this. Хајде сада да погледамо методе које омогућавају да се наметне, у ком контексту се позива функција (односно да се насилно каже чему је једнак this).

Прва метода коју ћемо размотрити зове се call. Хајде да погледамо њен рад на примеру. Нека имамо унос:

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

Хајде да добијемо референцу на овај унос и уписемо је у променљиву elem:

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

Хајде сада да направимо функцију func, унутар које исписујемо this.value:

function func() {
	console.log(this.value);
}

За сада наша функција не зна на шта се односи this. Ето, да смо је везали преко addEventListener, онда да. Али ми то нећемо учинити. Уместо тога ћемо једноставно позвати нашу функцију, рекавши јој да this мора бити једнак elem.

То се чини овако: func.call(elem). Овај код је еквивалентан простом позиву функције func овако: func(), само са ограничењима да је this једнако elem.

Дакле, синтакса методе call је: функција.call(објекат). Хајде да саберемо све заједно:

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

function func() {
	console.log(this.value); // исписаће value уноса
}
func.call(elem);

Дата је функција:

function func() {
	console.log(this.value);
}

Дата су три уноса:

<input id="elem1" value="text1">
<input id="elem2" value="text2">
<input id="elem3" value="text3">

Помоћу методе call и функције func испишите на екран value сваког од уноса.