Связанная функция (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) в конструкторе была стандартной практикой.