Почему в стрелочной функции иначе работает this

почему в стрелочной функции, присвоенной свойству func в объекте obj, не виден контекст этого объекта?

const obj = {
    prop: 'Ok',
    func: () => {
        return this.prop;
    }
}
 
console.log(obj.func()); // TypeError: Cannot read properties of undefined (reading 'prop')

3 года назад

Ivan Gagarinov

Присоединяйтесь к нашему Telegram-сообществу

Ответы

Стрелочные функции не имеют своего контекста this, поэтому они сохраняют текущий контекст, в котором были созданы. Не смотря на то, что в примере функция присваивается свойству объекта, само создание функции происходит в момент присваивания, объект в этот момент ещё не создан. Функция привязывается к тому контексту, в котором была создана - это называется "раннее связывание".

Есть и "позднее связывание", где функция привязывается к контексту того объекта, в котором находится. Такие функции создаются с помощью ключевого слова function:

const obj = {
    prop: 'Ok',
    func: function() {
        return this.prop;
    },
};

console.log(obj.func()); // => 'Ok'

3 года назад

Ivan Gagarinov

10 месяцев

Фронтенд-разработчик

Верстка на HTML5 и CSS3, Программирование на JavaScript в браузере, разработка клиентских приложений используя React

2 месяца

ООП на Javascript

Навык глубокого понимания архитектуры и написания чистого кода, позволяющий решать сложные задачи

1 месяц

СИКП на JS

Навык понимать программы на фундаментальном уровне, уверенно проходить собеседования и решать сложные задачи

8 месяцев

Автоматизатор тестирования на JavaScript

Git, JavaScript, Playwright, бэкенд-тесты, юнит-тесты, API-тесты, UI-тесты, Github Actions, HTTP/HTTPS, API, Docker, SQL

2 месяца

Typescript

Навык снижать ошибки, упрощать отладку, повышать качество кода и ускорять разработку с автодополнением и типизацией

Похожие вопросы