Логотип YeaHub

База вопросов

Собеседования

Тренажёр

База ресурсов

Обучение

Навыки

Войти

Выбери, каким будет IT завтра — вместе c нами!

YeaHub — это полностью открытый проект, призванный объединить и улучшить IT-сферу. Наш исходный код доступен для просмотра на GitHub. Дизайн проекта также открыт для ознакомления в Figma.

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про JavaScript: bind, arrow, function, this

Как можно привязать контекст функции и чем отличается bind от стрелочной функции

Вопрос проверяет, умеешь ли ты управлять this и понимаешь ли разницу между “фиксированием контекста” и лексическим this.

Короткий ответ

Контекст можно привязать через bind, call, apply, через обертку (() => fn.call(obj)), или используя стрелочную функцию там, где нужен this извне. bind возвращает новую функцию с “приклеенным” this и (опционально) аргументами. Стрелочная функция не имеет собственного this и берет this из внешней области видимости, поэтому ее нельзя “перебиндить”. bind удобен, когда нужна повторно используемая функция с фиксированным this, а стрелка — когда важно сохранить внешний контекст (например, внутри метода при передаче колбэка).

Длинный ответ

Определение

Привязка контекста — это способ сделать так, чтобы внутри функции this был предсказуемым, даже если функция вызвана “не как метод”.

Способы привязать/контролировать this

  1. bind

    1. фиксирует this

    2. может частично “подставить” аргументы (каррирование)

    3. возвращает новую функцию

  2. call / apply

    1. вызывают функцию сразу

    2. задают this для конкретного вызова

    3. разница: call(fn, a, b), apply(fn, [a, b])

  3. Обертка-стрелка

    1. сохраняет внешний this

    2. позволяет явно вызвать с нужным контекстом

Чем bind отличается от стрелочной функции

1) bind “приклеивает” this к функции

'use strict';

function show() {
  console.log(this.name);
}

const user = { name: 'Ann' };

const bound = show.bind(user);
bound(); // "Ann"

2) У стрелки this лексический и не меняется

'use strict';

const user = {
  name: 'Ann',
  showLater() {
    const arrow = () => console.log(this.name);
    arrow();
  },
};

user.showLater(); // "Ann"

3) Важный нюанс: стрелку нельзя “перебиндить”

'use strict';

const user1 = { name: 'Ann' };
const user2 = { name: 'Bob' };

const arrow = () => console.log(this); // this берется снаружи (в модуле обычно undefined)
const bound = arrow.bind(user1);

bound(); // не станет user1

Практические случаи

  1. bind полезен, когда:

    1. нужно передать функцию как колбэк и не потерять this

    2. нужна функция, которую будешь переиспользовать много раз

  2. Стрелка полезна, когда:

    1. пишешь колбэк внутри метода и хочешь сохранить this метода

    2. не хочешь думать о this внутри вложенных функций

Вывод

bind создает новую функцию с фиксированным this и подходит для переиспользуемых колбэков. Стрелка не создает свой this и просто “наследует” внешний контекст — идеально для вложенных обработчиков внутри методов.

Уровень

  • Рейтинг:

    5

  • Сложность:

    7

Навыки

  • JavaScript

    JavaScript

Ключевые слова

#bind

#arrow

#function

#this

Подпишись на React Developer в телеграм