Вопрос №54572 от пользователя Denis Maibach в уроке «Особенности работы this со стрелочными функциями», курс «JS: Введение в ООП»

Denis Maibach

Здравствуйте, подскажите что я пропускаю почему когда я вызываю reduce то у стрелочной функции берется контекст вызова не array а window ? я же определил и вызвал ее внутри reduce значит и контекст должен быть array.

Вкратце: контекст обычных функций зависит от места вызова, а контекст стрелочных функций — от того места, где они были определены.

[1, 2, 3, 4].reduce((accumulator, currentValue) => { console.log(this); return accumulator + currentValue; });

3 0

Сергей Мелодин

Denis Maibach, в данном случае функция определена не в объекте (как показано в теории), а внутри функции и для неё ближайшим объектом становится объект верхнего уровня, а не массива.

Если объявить таким же образом функцию в node.js с es-модулями, то в this будет undefined

0

Denis Maibach

Сергей Мелодин, Ок, а что на счёт обычных функций почему когда я вызываю функцию внутри addEventListener у нее появляется контекст(btn) а у reduce он почему-то равен undefined хотя у вас написано: контекст обычных функций зависит от места вызова

const btn = document.querySelector('button'); btn.addEventListener('click', function(){ console.log(this) });

[1,2,3].reduce(function(acc, value) { console.log(this) })

0

Сергей Мелодин

Denis Maibach, а здесь уже просто работают разные механизмы, в случае с event listener где-то под капотом происходит связывание контекста. Примерно так:

const btn = {
  type: 'submit'
};
const handler = function () { console.log(this); };
handler.call(btn); // { type: 'submit' }

Если не подменять контекст, то там будет глобальный объект - window или undefined, что мы и видим в reduce.

1

Есть вопрос или хотите участвовать в обсуждении?

Зарегистрируйтесь или войдите в свой аккаунт

Отправляя форму, вы соглашаетесь c «Политикой конфиденциальности» и «Условиями оказания услуг»

Рекомендуемые программы

С нуля до разработчика. Возвращаем деньги, если не удалось найти работу.

Иконка программы Фронтенд-разработчик
Профессия
Разработка фронтенд-компонентов веб-приложений
27 октября 8 месяцев
Иконка программы Python-разработчик
Профессия
Разработка веб-приложений на Django
27 октября 8 месяцев
Иконка программы PHP-разработчик
Профессия
Разработка веб-приложений на Laravel
27 октября 8 месяцев
Иконка программы Node.js-разработчик
Профессия
Разработка бэкенд-компонентов веб-приложений
27 октября 8 месяцев
Иконка программы Верстальщик
Профессия
Вёрстка с использованием последних стандартов CSS
в любое время 5 месяцев
Иконка программы Java-разработчик
Профессия
Разработка приложений на языке Java
27 октября 10 месяцев
Иконка программы Разработчик на Ruby on Rails
Профессия
Новый
Создает веб-приложения со скоростью света
27 октября 5 месяцев