02. Все ненавидят this. Про контекст вызова (разбор со студентами)

it-incubator.e... - человекоориентированное, честное и профессиональное обучение front-end и back-end разработке гарантированно до трудоустройства за фиксированную стоимость.
Поддержать меня можно на patreon / itkamasutra или оформив спонсорство на данном канале.
Ребят, что такое контекст вызова this ??? Показывает моя практика, новичкам ОЧЕНЬ сложно даётся понимание этого. А это ОЧЕНЬ важно!
Поэтому я на занятиях в офлайне буду тренькать дополнительно студентов и эти все разборы буду скидывать сюда, чтобы вы так же могли потренироваться и наконец поставить точку с этим нетривиальным товарищем THIS

[@mykhailorudenko8136]

счастья тебе, добра, здоровья, всего наилучшего. Столько сыночков, сколько в лесу пенечков

[@alexnikolaienko3478]

Димыч, понятнее. Шаг за шагом становится понятным. И объяснение на примерах людей заходит лучше всего.

[@icatsby900]

Спасибо за детальное разъяснение, теперь намного понятнее, что представляет из себя этот this.

[@pavelchagovskiy6447]

Какой же Вы супер преподаватель! Браво. Подписался.

[@Intervent89]

ЭТО, ПРОСТО, АХУЕННО (с)

[@Alexrudz]

Спасибо за видео! Аплодирую вместе со студентами!

[@mars_family]

Это хорошее видео, после первой части ничего не понял, но после этой части- кажется разобрался! Вопрос такой, а проблемы с this появляются только при использовании addEventListener , или ещё есть случаи ?

[@ПараСлов-н2и]

Класс! Объяснение огонь)

[@krypton5204]

спасибо за бодрый и не скучный урок)

[@AndreiD-f7s]

Спасибо за видео. Посмотрел и с this проблем нет.

[@Jest_Zloi_Voli]

Димыч спасибо Я въехал!

[@wlarcz]

Смотрю видос после JS вааще с нуля. В начале думал, что в целом понимал о this. Но чем ближе к середине я смотрел, тем больше возникало жгучее ощущение "аааа непонятно". К концу вроде отпустило с облегчением:) Через какое-то время надо будет вернуться пересмотреть видос со свежей головой.

[@ITKAMASUTRA]

Тема сложная! На канале появится структурированная инфа скоро по this

[@Vllad_Ko]

Super! Well Done!!

[@rustam9707]

Я не пойму зачем тут this? onShowNextBtnClick и так находится в slider1. что даёт приписка this, если onShowNextBtnClick и так находится в пределах скобок {} ???

[@torex1123]

Класс, спасибо!

[@vadimimmel7415]

Очень помогло!

[@annakulyk7587]

Спасибо за видос! Все равно кабзда, но за видео большое спасибо)

[@YarikKovalchuk]

Дякую!

[@pavelchagovskiy6447]

function test(images) { alert(this + " ggg "); } btn.addEventListener("click", test); Promise.all(objects.map(loadImage)).then(test); Доброго Вам дня. Помогите разобраться. Есть некая функция тест, выводящая this. если мы пытаемся вызвать ее внутри листенера кнопки при нажатии, то получаем this, равный кнопке. Но почему-то внутри метода then он равен window

[@МаксимСоснов-с2ж]

как через инструмент разработчиков посмотреть какая функция на что ссылается? например как в 14:51

[@PavloFilonenko]

понял, прокачался 😀

[@markusha5630]

пздц сначала одно понимаешь, но потом понимаешь, что ты не так понимал ,что теперь нихера не понятно

[@pavelsazhin8009]

в eventListener обязательно указывать this? без него функция (или метод объекта Slider1) onShowNextBtnClick не включится? Если не включится - почему?

[@ITKAMASUTRA]

Легче будет понять ваш вопос,, если укажете номера строк и минуту на видео, о котором идёт речь!

[@ИгорьНово]

Димыч ты БАТЯ !!! =)))

[@Vitaliy-ct2wv]

супер! но я не до конца разобрался

[@ITKAMASUTRA]

Тёма очень сложная!

[@Андрей-з3й9ю]

Димыч спасибо тебе огромное) ты как всегда выручаешь))) я посмотрел только 20 минут, решил что не дело так смотреть, написал слайдер без обьектов, все работает все понятно, потом написал слайдер который обьект и я вызываю его методы и обращаюсь к его полям, через бряки посмотрел что там с this, вроде понял как эта движуха работает) Только возник вопрос, нафига они такое замутили, почему было не сделать this как в других языках - просто обращение к полям обьекта внутри этого обьекта. А здесь я могу вызвать методы обьекта с контекста кнопки, я не знаток JS, может какой то супер смысл в этом есть, но на первый взгляд какие то лишние заморочки - следить за тем this, байндить его или использовать arrow-functions что б он не терялся, как то вроде геморно придумали!?

[@ITKAMASUTRA]

Вообще да, скорее гемор! Но... часто это используется как фича: не нужен нам в обработчике сам объект, а кнопка условно нужна... и мы через this к ней обращаемся! Или у какого-то объекта есть крутой метод, и мы можем его с помощью определенных техник (call, apply) вызвать от имени другого объекта (заимствование метода вроде называется это) Последний пример, а также более сложные сценарии часто юзаются крутыми разрабами при разработке сложных вещей, типа библиотек, фреймворков! Для простых смертных как мы и скорее экзотика!

[@Андрей-з3й9ю]

@@ITKAMASUTRA Ясно, надо ещё дорости до this :) Спасибо за ответ)

[@DENIS_4K]

на 24:05 у нас же есть доступ к btn в onShowNextBtnClick , из start. Я написал консоль лог btn внутри onShowNextBtnClick , и при клике вывелcя