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

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

Првиот метод што ќе го разгледаме, се вика call. Ајде да ја погледнеме неговата работа на пример. Нека имаме input:

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

Ајде да ја добиеме референцата на овој input и да ја запишеме во променливата elem:

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

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

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

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

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

Значи, синтаксата на методот call е: функција.call(објект). Ајде да собереме сè заедно:

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

function func() {
  console.log(this.value); // ќе го испечати value на input-от
}
func.call(elem);

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

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