Контекст вызова функции. Фундаментальный JavaScript
HTML-код
- Опубликовано: 28 июн 2021
- Работа с ключевым словом this в JavaScript поначалу может доставить немало хлопот. This указывает на контекст. Но откуда он берётся? Пробуем разобраться, отконсолив с десяток разных вариантов этого this.
MDN developer.mozilla.org/ru/docs...
#js
Мои курсы по вебу с купонами:
✅ mishanep.com/
📢 Поддержка канала:
/ mishanep
www.tinkoff.ru/rm/nepomnyasch...
paypal.me/mishanep
0:04:35 *this указывает на глобальный обьект, по всей видимости потому что он находится внутри setTimeout*
this это идентификатор, который устанавливается в момент вызова функции.
Кроме bind существует две штатные ситуации установки this - при вызове функции выражением dot expression
например myObj.method(). В этом случае в момент вызова функции this будет установлен в base для dot expression.
То есть внутри method this будет указывать на myObj
Второй способ использование width statement. Который запрещен в strict mode. Иными словами про него можно забыть.
Во всех прочих случаях this *всегда будет указывать на globalObject*
Основная проблема изучающих JS в том, что они пытаются к языку у которого есть свое собственное поведение
притянуть за уши привычные концепции класс ориентированных ООП языков. Таких как Java например, где this
это контекст. В *JS this это НЕ КОНТЕКСТ* В JS this это обычный идентификатор, который устанавливается строго в
момент вызова функции и равен глобальному обьекту. Исключение dot expression: obj.method
0:09:43 *this и addEventListener или любое другое стороннее API*
В случае использования не JS API, this может быть установлен как угодно.
А точнее так, как это задумал разработчик API. То есть в случае eventListener this указывает на обьект кнопки
не потому что метод вызывается в каком то там контексте. А потому что DOM API в своей спецификации написал,
что при подобном вызове this всегда будет указывать на обьект инициатор.
Ого, не ожидал вас здесь встретить!) Вам бы с Михаилом объединиться и сократить многосерийные пятичасовые видео до частей по 15 - 30 минут. Это были бы самые лучшие уроки на youtube)
спасибо Деми Мурычу за правки) Проверьте еще пожалуйста такого человека как ayub begimqulov, у него много интересных уроков есть.
Михаил, благодарю! Я сейчас как раз смотрю Ваши лекции! )))
Отлично, вовремя!
Как раз через 2 дня изучаю этот вопрос на онлайн-курсах.
Смотрел несколько твоих роликов - очень классно разьясняешь.
Этот видос ОБЯЗАТЕЛЬНО посмотрю
Очень шикарное объяснение!
Обалденно, спасибо
Михаил как всегда супер! Отличный контент на вашем канале! Спасибо, продолжайте в том же духе)
Большое спасибо за пример с 'const that = this'! Увидел в другом видео такую запись рядом с requestAnimationFrame(). Чуть голову не сломал пока разобрался что к чему. Ваше видео помогло понять как моя ситуация срабатывала.
Спасибо большое
Непомнящий помогает вспомнить
спасибо, годно)
Thanks
Годнота подъехала, спасибо за труды)
Про redux не собираешься делать уроки или может курс на юдеми дополнить им?)
Я иногда думаю в эту сторону. За 30 минут полноценно не расскажешь, кликер можно конечно собрать)) Возможно к концу года выпущу второй курс по Реакту - с дополнительными интсрументами.
наконец JS вернулся)
голос приятный. думаю, именно таким голосом должен говорить разработчик)
Михаил, спасибо! Подскажите пожалуйста, не планируете сделать видео по продвинутой работе с формами, и валидацией ? Типа yup-а, useForm, Formik и т.д.))
Приветствую!
В ближайших планах нет. Возможно когда-нибудь доберусь и до этого.
Михаил, спасибо 😉 Кажется, я знаю Вашу музу 😅
0:14:04 разве привязка bind позволяет переопределять контекст повторно, вроде же только один раз?
Не позволяет. Например это уже не сработает, как в предыдущий раз: person3.hi = person2.hi.bind(person3); Вывод будет Hi, I'm Person 2, а не Hi, I'm Person 3
rson2.hi = person.hi без bind тоже работает нормально)
лойс
Жаль, что в вашем платном курсе нет подробного разбора этой темы JS.
17:28 тут bind необязателен.
С bind создается новая независимая от person.hi функция, а при простом присваивании person2.hi = person.hi присваивается лишь ссылка на person.hi если речь об этом
Я правильно понимаю, что this это ссылка не некий объект, в контексте которого выполняется функция. Также с помощью this мы можем получить доступ к свойствам этого объекта.
Да, всё верно.
Как и в других видео - не объясняется, зачем нужен This. Впрочем, даже статья на MDN не даёт чёткого ответа.
Как ты это вспомнил?