Связанная функция (bound function) — результат вызова .bind() на любой функции. Возвращается новая функция, у которой this зафиксирован в переданном значении раз и навсегда:

function sayHi() {
  return `Hi from ${this.name}`;
}

const boundHi = sayHi.bind({ name: 'Аня' });

boundHi();                              // 'Hi from Аня'
boundHi.call({ name: 'кто-то ещё' });  // всё равно 'Hi from Аня'

Разница со связкой .call()/.apply() в моменте: непрямой вызов — одноразовый, здесь и сейчас. .bind() — функция-фабрика, которая создаёт новую функцию с уже прикреплённым контекстом. Эту функцию можно передавать дальше как callback, сохранять в переменную, использовать многократно.

Что в этой главе

Две подглавы:

  • this в связанной функции — синтаксис .bind(), разница между временными и постоянными привязками, применение в event handlers, partial application (передача части аргументов).
  • Жёсткая привязка контекста — что происходит, если пытаться переопределить привязанный this. Почему .call() не может изменить контекст bound-функции, и как new всё же обходит эту защиту.

.bind() — главный инструмент решения проблемы «метод отделили от объекта» (см. подглаву 3.2). В React-классах до появления hooks идиома this.handleClick = this.handleClick.bind(this) в конструкторе была стандартной практикой.