Прывязванне кантэксту праз метад call у JavaScript

Такім чынам, мы разабралі, як на самой справе працуе this. Давайце цяпер разгледзім метады, якія дазваляюць прымусова паказаць, у якім кантэксце выклікаецца функцыя (гэта ёсць прымусова сказаць, чаму роўны this).

Першы метад, які мы з вамі разбярэм, называецца call. Давайце паглядзім на яго працу на прыкладзе. Хай у нас ёсць інпут:

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

Давайце атрымаем спасылку на гэты інпут і запiшам яе ў зменную 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 інпута
}
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">