JavaScript #9 Функции: Замыкания, области видимости, лексическое окружение

Подписаться 118 тыс.

Просмотров 14 тыс.

50% 1

#YauhenK #webDev #JS #JavaScript
Всех приветствую в курсе «JavaScript».
В данном видео-курсе мы с вами поподробнее рассмотрим особенности языка, которые вызывают затруднения при его изучении. Ключевой упор, так же, будет сделан на вопросы, которые вы можете услышать на собеседовании на вакансию front-end разработчика.
✒ Используемые ресурсы и инструменты:
✔ Codepen (Онлайн редактор кода): codepen.io
✒ Полезные ссылки:
✔ Учебник JavaScript: learn.javascri...
✒ Полный список готовых и планируемых курсов:
✔ Trello: trello.com/b/R...
✒ Автор курса:
✔ RU-vid: / yauhenkavalchuk
✔ Instagram: / yauhenkavalchuk
✔ Twitter: / yauhenkavalchuk
✔ VK: YauhenK...
✔ LinkedIn: / yauhenkavalchuk
✔ GitHub: github.com/Yau...
✔ VK (Группа): webdevcom
✒ Поддержать развитие канала: github.com/Yau...

Опубликовано:

11 сен 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 64

@MAKSIMTSA 2 года назад

Первый человек,который нормально, без "абстракций", объяснил эту тему!)

@YauhenKavalchuk 2 года назад

Спасибо

@ШураБосс 6 лет назад

Просто отличный урок, спасибо вам за труды!

@YauhenKavalchuk 6 лет назад

Спасибо вам за отзыв

@annavoloshyna3524 4 года назад

Наконец-то хоть кто-то нормально объяснил замыкания. Пример с десятью кнопками - просто класс! Спасибо

@YauhenKavalchuk 4 года назад

Спасибо за отзыв)

@mrsiarhei3328 4 года назад

Супер! Отлично объяснено что такое замыкание, именно простыми понятными словами!

@YauhenKavalchuk 4 года назад

Рад, что понравилось)

@user-nd3rb7hl8n 5 лет назад

Спасибо.Особенно за примеры которые являются реальнимы ситуациями

@YauhenKavalchuk 5 лет назад

Пожалуйста!

@veronasuhka6989 3 года назад

Спасибо, вы, как всегда, лучший!

@YauhenKavalchuk 3 года назад

Спасибо)

@user-kc2dp3cf7y 4 года назад

Очень крутой урок, спасибо!

@YauhenKavalchuk 4 года назад

Пожалуйста

@user-xo6yn6mk7j 2 года назад

Хорошее объяснение

@YauhenKavalchuk 2 года назад

Спасибо

@artemijeka 3 года назад

Супер!

@YauhenKavalchuk 3 года назад

Отлично)

@araratmatinyan832 5 лет назад

спасибо!!!! только от тебя понял

@YauhenKavalchuk 5 лет назад

Спасибо за отзыв, рад если действительно помогло)

@Infinity-zf8ms 3 года назад

Огромное спасибо за ваш труд)

@YauhenKavalchuk 3 года назад

Огромное пожалуйста

@alexmerser7455 5 лет назад

Хороший пример в конце. Можно использовать для слайдера при клике на опредленный кружочек навигации. Раньше делал через делегирование. Оказывается можно проще)

@YauhenKavalchuk 5 лет назад

Спасибо за отзыв!

@denysgoloborodko3855 5 лет назад

Пример показательный, но на практике намного проще просто заменить var на let(как по мне, возможно я ошибаюсь и есть нюансы)

@pavelsilber7959 6 лет назад

Спасибо!!!

@YauhenKavalchuk 6 лет назад

+Pavel Silber Пожалуйста

@user-lf8gj2lj2p 4 года назад

Евгений, поясните пожалуйста, продублировал ваш код(7.33), до того как вы создали замыкание в функции, и по клику в консоли всегда показывалось 10 как и у вас. Потом в цикле for где обьявляется переменная i заменил var на let, и по клику стало показывать всегда нужную цыфру. Это такая особенность let ?

@YauhenKavalchuk 4 года назад

Да, область видимости let и const - внутри фигурных скобок

@b4bcat 5 лет назад

Добрый день. Скажите пожалуйста, на 8.25 минуте, вы сказали что вызываем функцию в строке 5, относительно i в строке 7. И дописали (i) после функции. Можно поподробнее про это прием? Что происходит?

@YauhenKavalchuk 5 лет назад

Это просто упрощённый синтаксис вызова функции с аргументом, как аналог вот более понятный синтаксис: var func = function(x){}; func(i);

@b4bcat 5 лет назад

@@YauhenKavalchuk понятно, спасибо. То есть написав (i), мы вызвали анонимную функцию и передали ей i.

@YauhenKavalchuk 5 лет назад

да

@alexmerser7455 5 лет назад

@@b4bcat В данном случае можно объявить i через let и тогда не возникнет такой проблемы)i будет выводиться так, как нужно)

@TheGoBender 7 лет назад

То есть, Вы просто берете главы из учебника Ильи Кантора, озвучиваете и выкладываете? В чем смысл?

@YauhenKavalchuk 7 лет назад

Все по разному воспринимают информацию, кому-то удобнее через видео-уроки, кому-то через книги.

@factotum5987 7 лет назад

Можно ли передать функции параметр (переменная или другая функция) которые находятся внутри этой же функции? Или они должны всегда бить из внешних скоупов?

@YauhenKavalchuk 7 лет назад

А смысл передавать что-то в функцию, если оно там уже есть? Грубо говоря, зачем передавать в функцию переменную, которая там уже есть.

@bogdanshelomanov5668 4 года назад

Environment и Scope это одно и тоже или нет?

@vladbilenko3480 4 года назад

Грубо говоря. Environment это совокупность всех Scope, которые доступны для участка кода. Плюс, это просто описательное название, что сказано в ECMAScript. "Lexical Environments and Environment Record values are purely specification mechanisms and need not correspond to any specific artefact of an ECMAScript implementation. It is impossible for an ECMAScript program to directly access or manipulate such values."

@vovk1805 7 лет назад

Евгений, накидал пример с видео на ES6 codepen.io/vovk1805/pen/VbqmXe?editors=1111 Можете пояснить что произошло? Если я правильно понял то у let = i своя область видимости, которая ограничиваеться только циклом, а функция использует уже совсем другую переменную i? Не могу до конца понять((( И еще, правильно ли выполнять присваивание номеров кнопкам через forEach? (там где код закомментирован). Можно как то сделать onclick тоже через forEach или другой метод перебора массива? Буду очень благодарен за ответы. УСПЕХОВ КАНАЛУ И ВАМ!

@YauhenKavalchuk 7 лет назад

На счёт первого, верно. Видимость let ограничивается фигурными скобками. Второе тоже нормально, на счёт присваивания через forEach. На счёт последнего присваивание можно выполнить за счёт второго аргумента переданного в метод. /* присваивание номеров кнопкам через forEach */ buttons.forEach((elem, num) => { elem.innerHTML = number++; elem.onclick = () => console.log(num+1); }); Но это идёт только для данного примера.

@vovk1805 7 лет назад

Уроки просто отличные. Огромное спасибо автору. Однозначно лайк и подписка. Не планируете серию обучающих уроков по ReactJS и новым фичам ES6? (могли бы Вы посоветовать какую то литературу или скринкасты по React, кроме офф документации)

@YauhenKavalchuk 7 лет назад

Спасибо за отзыв. Что касается курсов по React и ES6, да они планируются в ближайшем будущем. Что касается литературы, то ничего посоветовать не могу. Изучал по официальной документации и личным "шишкам").

@pavelsilber7959 6 лет назад

Объясните, пожалуйста, синтаксис двух скобок sum()()

@musiclab5816 6 лет назад

Просто пример

@pavelsilber7959 6 лет назад

Evgeny Kovalchuk , такого ровнодушнего ответа не ожидал.

@BoffkaBoffka 6 лет назад

Так же первый раз сталкиваюсь... Жаль что расширенного ответа нет.

@musiclab5816 6 лет назад

Я имею ввиду что это был просто пример для объяснения материала. Но если хотите подробный ответ, пожалуйста: Данный пример очень часто встречается при ассесментах или при приёме на работу. Смысл в следующем: Мы создали функцию sum и вызывали её с параметром - синтаксис sum(a). Данная функция при выполнении возвращает вложенную функцию (у неё нет имени просто function(){}), которую мы тоже хотим выполнить, т.е. нам нужно выполнить сначала внешнюю функцию, а потом тут же внутреннию, отсюда и двойные скобки ()() - выполнить функцию и выполнить внутреннию функцию, которая возвращает данная функци. Надеюсь объяснил понятно.

@YauhenKavalchuk 3 года назад

Отработка 1 функции, возврат из неё 2 вложенной функции, вызов этой вложенной функции