Урок 2. JavaScript. Что такое контекст this. Как работает call, bind, apply
ฝัง
- เผยแพร่เมื่อ 30 พ.ย. 2024
- Эксклюзивный контент в Telegram: t.me/NextgenSo...
Telegram: t.me/js_by_vla...
Instagram: / vladilen.minin
Roadmap по каналу:
vladilen.notio...
JavaScript. Что такое контекст this. Как работает call, bind, apply
В видео вы узнаете, что такое контекст в JavaScript, как он работает, как его передавать и что с ним можно делать.
В уроке вы узнаете про методы call, bind, apply - разницу между ними
В конце вы увидите практическое применение prototype в связке с контекстом и ключевым словом this
Сложный JavaScript простым языком:
• Урок 1. JavaScript. Чт...
Ну что господа, стало ли более понятно с контекстом? Будем двигаться дальше?
Единственное, что возник вопрос про call и apply
Если у них разница только лишь в способе передачи аргументов, то зачем тогда в js два идентичных по сути метода?
Или может все же есть ситуации, когда более удобно будет использовать тот или иной способ?
@@hellicobacterpillory6677 Когда мы не знаем количество параметров, которые нужно передать в функцию, то единственный способ это использовать apply
Когда знаем - call
Запрос понял, сделаю пример
Пожалуй лучшее объяснение что я видел на ютубе, жду промисы
Нужно дополнить про специфику контекста в стрелочных функциях
@@ural-site Насколько знаю в стрелочных функциях контекст жестко привязан к объекту в рамках которого она была инициализирована. По аналогии, как метод bind жестко закрепляет за собой контекст (и даже аргументы). Вроде прав? Поправьте, если не так
02:57 оно вызывает то, что стоит слева от точки, где мы вызываем данную функцию
03:20 Ключевое слово this всегда динамичное, оно указывает на тот объект в контексте которого оно было вызвано
04:50 функция bind - в качестве значения этой функции му можем передать тот контекст который будет привязан у вызываемой функции
05:37 сам по this себе указывает на глобальный объект window
09:00 метод bind на самом деле не вызывает функцию, а возвращает новую функцию которая уже привязала к себе новый контекст
09:50 метод group у объекта console
12:51 С помощью метода bind, помимо того что первым параметром мы указываем контекст который должен быть привязан к новой функции, другими параметрами мы можем передавать следующие параметры которые нужны функции
13:47 Метод call. Отличие от метода bind, что он метод call сразу же вызывает эту функцию, а метод bind в свою очередь возвращает нам новую функцию, и её мы можем вызвать тогда, когда нам угодно
14:50 Метод apply. В отличие от методов bind и call, где можно бесконечное число параметров, в метод apply мы всегда передаем два параметра.
У метода apply второй параметр всегда массив, и этот массив состоит из аргументов которые попадут в эту функцию.
Метод apply сразу же вызывает эту функцию.
15:45 Практика с использованием прототипов и контекста (this)
Кто ты воин !!!?? Доброжелатель )))
уроки настолько качественны, что доставляет такое же удовольствие как просмотр обычных роликов
как ты определил качество уроков?
@@grantorino3465 он просто кайфанул так сказать
Как просмотр порно
Отдельное Спасибо хочу сказать Владилену за то, что в начале видео он говорит, что тема простая для понимания. А то заходишь в панике пытаясь понять, и тут на тебе, "простая тема". Это помогает.!
Вот неужели никто раньше не мог так понятно объяснить?) шикардос!)
реально спасибо большое, сколько на JS пишу, всегда боялся этого this, особенно bind и apply :-) вот прям рассказал так, что все очень и очень понятно, прям разжевал и в рот положил. Респектос!
Благодарю за отзыв)
как успехи
Наконец по человечески всё объяснили, а я голову ломал, когда учил. А мог просто посмотреть. Автор молодец
Наконец три этих метода и их отличие, объяснили доступным языком и, без "воды". Огромное спасибо, сейчас нужно подтянуть знания по JS и Ваш труд в этом очень помогает!
Отличный канал по JS. Однозначно лайк, хорошее объяснение материала!
Просто взрыа мозга. Автор твои видео это просто пушка, другого названия не придумать наконец то я все это понял. Разложено по полочкам с превосходными примерами.
Это великолепно! Смотришь и радуешься, что такие замечательные вещи узнаешь и понимаешь. Всё логично, а главное сразу видишь, зачем нужны эти "премудрости"))) Спасибо!
Я так и не понимаю для чего это нужно уже сделав десятки проектов, обойдясь без этого. Видимо такие проекты)
Спасибо за достаточно понятное объяснение, такого контента мало, в основном одни основы js
Владилен, спасибо тебе огромнейшее за материал. Очень помог! До этого видоса дня два разбирался с this и методами, не мог устаканить в голове. Респект за твой труд! Верю, что все эти не простые времена пройдут быстро!!!
Спасибо за наглядное объяснения. Благодарен за то, что такой прекрасный контент еще и в бесплатном доступе)
У вас просто талант объяснять сложные вещи простым языком. Снимаю шляпу)
Я наконец-то понял зачем еще нужен bind, когда есть call.
Лучшее объяснение bind, call и apply на всем рунете
Лучшее объяснение bind, call,, apply, которое я видел. Спасибо! Для this не затронута тема стрелочных функций, но в целом все и так думают знают, что стрелочные функции не имеют собственного контекста выполнения. На практике это означает, что они наследуют this от родительской функции.
2022 - видео до сих пор актуально.
Спасибо, Владилен, за подробный разбор!)
Очень круто, на ютубе 99% видео о том, как создать переменную и вызвать функцию, скопированную из другого обучающего видео, а такие темы практически не затрагиваются. Тебе прям огромное спасибо)
В этом и была идея. На канале не будет основ. Только крутые продвинутые вещи)
Именно такое объяснение нужно, чтобы понять как все работает. Спасибо большое. Долго разбирался с this, теперь все понятно. Оказалось это совсем просто
чувак !!! ты монстр просто !! ты настолько тактичный ... спасибо !!!❤
Ваш контент просто 10 из 10. Действительно помогаете расширять видение кода и возможности использования js
Такого рода материалы - то, что нужно для понимания работы js. Уроки действительно исключительные и полезные )
Благодарю за отзыв )
Это не курс, а клад!! Спасибо большое ❤️
Как я рад что нашел ваш канал, ваши видео эффективнее любых текстовых туториалов
твоё любимое слово "на самом деле"
Good Luck Broo
Наконец-то что-то адекватное появилось на этой площадке.
Александр Зенин плюсую
да, уроки очень полезные, некоторые вещи я вообще думал по-другому работают, в общем автору хорошего здоровья и успехов!
Глупые вы, намеренно создаёте уязвимость.
Просто супер понятно, каждый видос заслуживает высших похвал
Я новичок в программировании и долго не мог понять о каких контекстах и объектах вообще идет речь, поэтому для меня this было чем-то очень непонятным, но насколько же было гениально сказать про то, что this возвращает ту левую штуку после точки. Всё сразу встало на свои места и мне удалось разобраться с контекстами. Большое спасибо.
Пожалуй, самое доступное объяснение понятия контекста
очень круто, наконец-то въехал в эту тему. Благодарность
Не просто показал конекст this)) а научил менять вселенную) вселенную в моем мозге)
Не просто показал, он его к ... привязал!
Очень легко и доступно)). Думал что сложная тема но зашла просто с первого раза)
Спасибо Вам огромное! Смотрю, впитываю, записываю. Учусь у Вас!
ДААААА!!! НАКОНЕЦ-ТО НОРМАЛЬНОЕ ОБЪЯСНЕНИЕ!!!!!!!
Добро пожаловать:)
Офигенно, быстро и походчиво!! Спасибо за то, что ты есть!
Сейчас прохожу курсы, для меня довольно дорогие... Ментору до тебя как до небес в плане доходчивого объяснения....
Вау. У меня просто нет слов. Лучшее объяснение контекста. Огромное спасибо, Владилен!
Честно говоря, судя по лайкам, и коментам, на твоем канале находятся "Выжевшие" ,те кто не выгорел и дошел до хорошего уровня понимания js, а так же те кому реально интересно и он болдеет от процесса разработки и создания. Мощнейшие видосы, достоиные овердох*я лайков и подписки, классно преподносишь, а главное доступно - понятно! Респект тебе👍💪
Лучших уроков по javascript чем у Вас Владилен я не встречал!
Так держать!
Круть, прям залип. Не ожидал, что такие курсы есть в свободном доступе
С первого раза понял!Другие так не могут обьяснить!Владилен я тебе благодарен!)))
Чувак, это самое ясное и понятное из всего, что я слышал о понятии «контекст». Когда учил ооп в пхп мозг взрывался от этого слова. Сенкью вери мач. Спустя полгода практики на место становится теория. Лайк, подписка, респект!
Пересматриваю плейлист по второму кругу. Хочется поставить по второму лайку!) Спасибо огромное!
учиться у senior'а мне как начинающего углублённо знать js и то, что у него под капотом, с грамотной подачей и доходчиво (хоть и придётся снова и снова возвращаться) прям супер
Чувак ты лучший. Всегда систематизированная подача информации, класс
Спасибо, Владилен) Наконец-то понял как работает this)
Большущая БЛАГОДАРНОСТЬ за такой подробный урок и настолько понятную подачу материала, который сложно где-то раскопать в русскоязычном сегменте TH-cam.
Круто! С прототипами вообще ШОК контент для меня получился))) Очень удобно. Благодарю!!!
Спасибо отдельно за порции. Их можно переварить за один присест.
Идеальное объяснение темы. В том числе и по хронометражу ролика.
Платформа супер,все работает как надо)
Отличное объяснение. Спасибо
Очень полезное, информативное и доступно изложенное видео, с отличными примерами, респект автору! До его просмотра я так и не мог понять тонкости "this", а теперь всё стало ясно.
Владилен какая же ты машина, спасибо тебе за этот курс, была б моя воля я бы тебе отдался
Лучшее объяснения чем здесь не найти
Владилен, огромное спасибо за уроки!
Не хватает только разве что домашних заданий с задачками. Для полного усвоения материала
Я теперь понимаю все конструкции языка.
Далее можно смотреть и понимать код с Гитзаба
А далее - пора будет начинать делать свои проектики.
Задания - не нужны.
11:35 job is undefined... аж грустно стало немного
Посмотри в const person у тебя в logInfo должно быть ${job}, а не ${this.job}. Аналогично с phone. Такая же беда была. После замены все отображается
@@lostsouls3151 чел ты...
@@stanislavkravtsov5404 ???
@@lostsouls3151 ну, она зарофлила, мол работа - не найдена(job is undefined)а ты подумал, что у неё код с "job" не работает
@@stanislavkravtsov5404 бля.... Только дошло😅 а я на полном серьёзе подумал с кодом проблема 😂😂😂
Огромное спасибо! Давно не могла разобраться с этими методами
Тот случай, когда прочитала гигантскую статью, но разницу между bind и call/apply поняла только благодаря вашему паруминутному пояснению)))) Спасибо! Думаю, за продвинутым js приду к вам)))) А пока надо хорошенько поджунить.
иногда думаю как хорошо, что знаю язык на котором ты говоришь и делишся такой классной инфой
Отличный ролик! Спасибо, Владилен. Практический пример в конце реально очень ценен
Владлен, огромное спасибо за труд! Вы великолепно обьясняете!
Практический пример афигенный! Спасибо, четко и понятно рассказываешь и показываешь
в обычных уроках на более простом уровне учат про контекст this, что он позволяет просто обратиться к названию объекта при написании методов внутри объекта. В твоём же уроке более понятно, что у this намного бОльшие возможности. Так же однозначный лайк за пример с прототипами. После этого стало намноjjго понятнее, для чего нужны прототипы и как конкретно ими пользоваться...
@@ojgenn а для чего тогда нужны прототипы? ну на примере данного видео, когда Владилен открывал прототипы Массива, там было штук 10 встроенных методов) нах они нужны?) Ну или любой ваш пример будет полезен для всех пользователей)
@@ojgenn ну не знаю. на мой взгляд это оооочень удобно. А для чего ещё в JS существует прототипное наследование??? Вот вам пример, видео ещё одного ментора. th-cam.com/video/0vs6WkNyzec/w-d-xo.html Посмотрите с 5:52. Он до этого рассказывает про прототипы, а потом с 5:52 говорит, для чего их удобно использовать
@@ojgenn Не не, про return пустой массив вопросов нет :) Я про то, что, исключительно как мне кажется, хоть я и вообще без опыта работы в JS, пока только обучаюсь, но используя исключительно интуицию, бла бла бла, КАРОЧ, как мне кажется юзать прототипы как ресурс для добавления туда некоего метода - удобно. Не важно, функции/объекты/массивы. Это позволяет однотипный метод не добавлять в каждый объект. Потом этот метод можно юзать на все сотни объектов. При необходимости. Речь про это, а не про return [] или {} :) может, я конечно, и не прав. Не буду спорить. Опять же говорю, что мне кажется, что это удобно.
@@ojgenn
Какой дурак будет добавлять через прототипы новый метод для глобального объекта с уже занесённым в справочник JS названием replace???...
Вот вам ещё ссылка на учебник learn.javascript.ru/dom-attributes-and-properties, тут приведен пример, когда создаётся новый метод, добавляется через прототип к глобальному объекту и можно юзать потом его везде :)
В общем, не буду с вами спорить, может вы и правы, я не про в JS, а только ученик, но я уже 4-й раз натыкаюсь в разных источниках на то, что прототипы для того и существуют, помимо прочего, чтоб через них добавлять какие-то методы С НОВЫМ НАЗВАНИЕМ.
@@ojgenn Я могу что-то не правильно говорить, пока ещё учусь :) но посыл мой вы поняли.
Очень хорошее объяснение, высшая похвала и огромное спасибо!
Шикарное объяснение!! Лучшее что видела) однозначно подписка и огромный лайк. Спасибо!
Благодарю, я старался)
Спасибо за уроки,ты большой молодец, столько часов крутого контента
Начал смотреть в сторону смены проф ориентации, программирование может быть интересным)
Это прекрасссно!
Впервые столкнувшись с роликами Владилена, сразу понал: "Вот тот человек, который мне щщас всё и объяснит!". =)
А с этим набором продвинутых видосов у меня скоро не останется вопросов по JS
Я начинаю чувствовать, что понимаю Javascript!
В замечательной книге "You Don't know JavaScript" автор отлично рассказывает про работу this. Он вводит понятие "Call site" (перевода нет, но думаю можно сказать "Место вызова"), короче this ссылается на тот объект, который вызвал данную функцию. Кому интересно, почитайте. Там целая книга только про this и прототипы (маленькая, не бойтесь). А ролик великолепный, все понятно, все по полочкам, все с примерами.
Владилен, лучший 👍
Дуже дякую. Тему пояненно дуже гарно та зрозуміло 💛
самое офигенное объяснение что я видел!
Наконец все прояснилось с контекстом, огромное спасибо, лайк и подписка)
Владилен, это просто бомба, ты объясняешь так как будто ты сам JS создал. Это лайк однозначно. Сразу видно что ты в этом просто "варишся" ни одной ошибки не сделал. Это означает что ты полностью осознаешь и понимаешь что ты делаешь. Супер.
Благодарю за адекватное знакомство с такой важной темой и за сэкономленные часы, дни... Возможно и не все сказано, я не в курсе, уверен дальше будет проще разобраться. Буду всем рекомендовать.
Бомба 💣! такого крутого обьяснения я ещё не слышал. спасибо! . Лайк. Наконец то я понял этот ненавистный this
ГУРУ, МАСТЕР, ОБОЖАЮ!!!
Спасибо, Владилен, за твои видео!
Отличный видос где все полностью понятно все// Благодарю автора
С первого раза все стало понятно! Спасибо огромное
супер, спасибо Вам большое)
заполняю "пробелы" в знании JS_
Просто восхитительные уроки, во всяком случае первые два)) Только начала смотреть плейлист)) Надеюсь, что я дальше буду смотреть с таким же удовольствием. Класс!!! Спасибо большое
Спасибо за видео, все очень круто, интересно и приятно смотреть ваши видео. Все понятно, Вы очень хорошо объясняете. Удачи вам!
Ты просто Мега Человек😎!!! Спасибо, этот пробел в знаниях мне вечно был не понятен местами...
спасибо за то что ты делаешь! Желаю десятки миллионов благодарных подписчиков твоему каналу!!!
Супер доступно та пізнавально🔥
Дякую!
Большое человеческое спасибо! Наконец-то все стало ясно.
Никогда не думал, что пойму this. Спасибо!
Кстати довольно удобно объяснено, вместо 4ех правил, которые я учил, чему будет равно this в той или иной ситуации тут все проще, контекст будет равен тому, что слева от точки
Спасибо за урок!
Чот я запоздал. благодарю за Урок Владилен
Спасибо за качественное объяснение, лайк подписка!
Крутая подача и объяснение материала!!!! Владилен Топ!
Владелин спасибо тебе очень круто объясняешь !
Ты машина, хорошо что начал эту тему)
То ли еще будет. Благодарю, Денис)
T-800 :-D
Спасибо за такой качественный контент 👏
Сильно мощно молодёжно.. Спасибо!!!
Спасибо за простое и доходчивое объяснение. Начал понимать что к чему!
а я больше приблизился к мысли, что я - пень
Отличный урок. Супер! Скажу ещё про одну вещь, если мы добавляем к прототипу массива новый метод, его начинает видеть for... in при перечислении (for... of нет, но знаю, что многим больше нравится for... in). Исправить это не сложно, достаточно использовать Object.defineProperty, указав имя нашего метода и класс Array, а в параметрах указать enumerable: false. Это же работает и с в других похожих ситуациях.
Замечательный пример вконце ! Благодарю !
Комментарий из восьми слов для поддержки этого видео.