Уроки Javascript #4. Что такое замыкания в JS (простыми словами + 3 примера)
HTML-код
- Опубликовано: 18 сен 2024
- Мой Telegram: t.me/stackdevru
В этом видео мы разберемся, что такое замыкания (Closures) в JavaScript и как они работают. Рассмотрим 3 примера использования замыканий.
Замыкания это одна из фундаментальных концепций JavaScript, которая сбивает с толку многих начинающих разработчиков JS.
Замыкание это функция у которой есть доступ к своей внешней функции по области видимости, даже после того, как внешняя функция прекратилась.
Мои Курсы:
Gatsby JS (полный курс): gatsbyjs.ru
React для начинающих: react001.ru
Все мои курсы (+ исходные файлы): stackdev.ru
Подписывайся на соц сети:
Telegram: t.me/stackdevru
VK: vasilymur
Instagram: / vm_online
Мой блог о веб-разработке: stackdev.blog
Я не встречал ещё более доступного и короткого объяснения
Спасибо!
Это магия! 12 минут меня отделяло от того, чтобы непонятное заклинание в начале видео, стало абсолютно понятным и логичным в конце
На втором примере стало понятно 50 на 50. И тут Василий выкатывает 3-ий пример, после которого, у меня все встает на свои места. Спасибо!
:) Спасибо!
кучу видео пересмотрел, еще не встречал того, кто знал бы настолько хорошо эту тему,чтобы мог объяснить. Все объясняют это по-разному и разное понимание.
Благодаря этому видео реально понял замыкания! Большое Спасибо!!!
Рад что вам было полезно:)
Спасибо вам большое! 🤗
Сегодня был экзамен "Программирование на JS", и в качестве доп вопроса спросили "Что знаешь про замыкание?"
Ответила то, что сегодня утром, пока ехала в автобусе, просмотрела
Поставили "5")
Круто) поздравляю
Очень понятно и интересно и ещё ждём от вас REDUX👍👍👍
СПС ОГРОМНОЕ я час не мог понять что такое замыкание и вдруг наткнулся на ваше видео и за 12 мин понял
Спасибо)
Спасибо! Хорошие примеры для объяснения замыкания.
prikolinii i svejii content, vsem budu recomandavati!!
Спасибо за поддержку!
Спасибо. Максимум полезной информации!
Автору большое спасибо за труд! Очень доступно
Круто! Спасибо большое! Чем больше учу язык тем больше понимаю важность хороших, понятных и разных примеров
Спасибо!
Господи спасибо Вам огромное за такое обьяснение. Ломал голову а тут всё настолько понятно!!!
Лайк подписка!!!
Спасибо!
очень хорошее видео!!!! спасибо большое
Вы замечательно все рассказываете , побольше таких уроков !
Спасибо!
Пожалуй, Лучшее объяснение!
Спасибо!
Очень приятная подача и хорошие примеры! Благодарю!
Спасибо!
Великолепное объяснение замыкания
Спасибо!
спасибо, Вася!
Спасибо! Очень понятные примеры и объяснение на высоте, продолжай!
Спасибо!
Большое спасибо за такое грамотное разъяснение!!!)
Спасибо за поддержку!
Самое прекрасное объяснение, спасибо!
Спасибо!
Лучший! Раза 3-4 учил, и тут прям осенило как все просто. Спасибо у Вас талант учить. Сам тренер по хоккею, не вру)!
:) Спасибо!
Рахмет! Вы умеете объяснять сложные вещи простыми примерами. Для основы самое то, очень лаконично и взаимосвязано, не то что у других авторов даже платных курсов, коих у меня много, создают переменные от балды, во время исполнения пропадает некая логическая связка вместе с этим и желание дальше смотреть. Как же все это парадоксально. Все жду момента когда вы выпустите полноценный буткемп по js, неее неее 2-х часов мало))
Спасибо! как раз работаю над этим:)
Спасибо Вам огромное за объяснение, на 0-ой минуте первый раз слышала слово "замыкание", к 8-ой могла объяснить, что это такое😌
Спасибо!
завтра без реального применения, забудешь)
Отличное объяснение! Василий)
Спасибо!
Хорошее, информативное видео! Спасибо за урок!
Спасибо!
Отличные уроки, спасибо!
Спасибо!!! 🤩
Понятно и ясно.
Спасибо
Понятное видео, спасибо
спасибо, Василий)
это наверное если не ошибаюсь 3 видео если не 4-ое , и только сейчас я догнал что значит замыкание, спасибо за помощь!
Спасибо!
Лайк, і підписка, всі відео супер. Більше прикладів,все дуже цікаво.
Спасибо!
Предполагаю, что если писать по старокрестьянски с использованием ООП - то будет примерно вот так:
class Player {
score = 0
countScore() {
return this.score++
}
}
const pl1 = new Player()
const pl2 = new Player()
///И в консоли
const pl1 = new Player()
const pl2 = new Player()
pl1.countScore() // ->0
pl1.countScore() // ->1
pl1.countScore() // ->2
pl2.countScore() // ->0
pl2.countScore() // ->1
pl2.countScore() // ->2
Что примерно является эквивалентом последнего примера.
очень понятные примеры. Было б еще в конце реальное применение...
Спасибо!
сокрытие реализации, кеширование и проч, но это продвинутые темы уже
Спасибо, очень понятным языком всё описано.
Спасибо!
Купил урок на UDEMY и ничего не понял🤦♂ . Нашел ваш ролик и все стало на свои места. Спасибо!!! 😊👍
Спасибо!
Спасибо, очень понятно
Спасибо!
Спасибо
"Замыкание - это возможность функции, которая находится внутри др функции, получать доступ к переменным, которые в области видимости родительской функции, даже после того, как родительская функция прекратила своё выполнение."
любая функция создает замыкание.
спасибо, всё шикарно 👍
Спасибо!
Видео хорошее. Чтобы лучше тему понять, как по мне, нужно ознакомиться с таким понятием как лексическое окружение
ух как незаметно пролетел урок
круто
Спасибо!
отлично
Спасибо!
👍👍👍
Классно
Базара ноль вообще вопросов не осталось
12:43 мы получили доступ не только к переменой score, но и к аргументу name . Вопрос меняется ли значение score во внешней функции или только во внутренней?
Хороший канал!!! Так внутренняя функция берёт не только переменную,но и аргумент внешней ?
Спасибо! Все верно. Внутренней функции доступны переменные - которые находятся в области видимости внешней функции - включая аргументы, которые мы передаем во внешнюю функцию.
в чем смысл создания замыкания в примере гражданами если мы можем написать обычную функцию и без замыкания?
like
Спасибо!
Спасибо за объяснение. Остался вопрос, а playerOne это функция высшего порядка?
похоже это сильно влияет на производи тельность, что если у меня несколько переменных и много игроков, вообще это правильный подход или есть способы получше, без замыканий например?
Правильно понимаю, что замыкание, это как шаблон, под который можно делать много экземпляров, и за счет того, что дочерняя функция не удаляется после завершения, то все работает как надо? Как например во втором примере, одна фунцкия под всех юзеров!
замыкание через возврат функции из функции это просто один из частных случаев замыкания, это не его опредление. Замыкание может быть и без функции в функции. Так что обьяснение не сосем корректное.
А какие ещё варианты могут быть? Подобные примеры с функцией в функции везде практически, где объясняют тему замыкания.
а почему пеерменные обьявляются через конст?
некуя не понятно, but очень интересно
При каждом запуске playerOne или playerTwo, начиная с первого запуска, должна создаваться переменная score и обнуляться согласно let score = 0; и, т.о. счётчик должен показывать всё время 1. В чём тут дело не пойму?
И где мы обращаемся к внутренней функции? Мы всё время обращаемся к внешней функции createPlayer.
Создайте (или скопируйте) репозитоий проекта, посмотрите логи, поиграйте логикой - и все станет понятно!
createPlayer вызывается один раз и возвращает функцию в переменную playerOne. Другую, не createPlayer. В нашем случае это scoreCount. Поэтому вызывая playerOne, ты по сути вызываешь scoreCount (а там никакого обнуления нет, только увеличение на 1)
Механизм понял, но полезного применения замыкания не вижу (((
Привет, если есть время и желание, можешь потестировать меня по js!
Я новичок, но оч хочу программировать..
Твой урок по классам очень крутой!
Благодарю, но определение я не запомню
Не понимаю, каким образом аргумент из функции addressGrazdanin (имя) встаёт на место параметра в анонимной функции?
Потому что когда вызов createAdress(address==type) возвращает внутри себя анонимную функцию которая возвращает address и name. И это анонимная функция записывается в переменную adressGrazhdanin. И эта переменная становится функцией и хранит в себе функцию createAdress() и Антон функцию и если вызвать её возвращает address и name.
Ну типа
adressGrazhdanin = function(name) {
return address и name
}
Если просто вызвать функцию createAdress("Гражданин") то нечего не произойдёт потому что он возвращает анонимную функцию. А у анонимная не работает без имени. Поэтому как бы присваиваем в переменную чтобы использовать эту функцию.
Почему-то у меня на 3 минуте, когда вызываю функцию external(); она перечеркивается и пишется, что устарела. Код такой же, проверил. Не подскажите где искать причину?
нашел причину, когда переименовал функцию. Зарезервировано слово что-ли?
Походу все всё поняли кроме меня) Почему родительская функция неактивна? Она же запускается каждый раз, просто через функцию обёртку. А к функции внутри мы не обращаемся ни разу кроме как запуская родительскую. Я не понял тейка.
Что это за шрифт?
Я не понимаю. Тут же просто присваевается то что возвращает внешняя функция канстанте, вот и все. То есть главное что у нас в ретурне. Мы бы могши на писать ретурн А и тогдабы константа содержала просто строку А.
А зачем это нужно?
Так и не понял, как автор вывел в консоль результат работ функций createPlayer() если нигде в коде нет команды вывода в консоль. Или мозги уже после объяснений отъехали
он вызывал функцию прямо в консоле где > | и тут пропиши playerOne() нажми enter все получится
В JavaScript все функции являются замыканиями, но есть исключение: функции которые объявлены через синтаксис new Function().
блин крутое объяснение, но все ровно пока не понял(
:) а вы просто смотрели - или код за мной писали?
@@stackdev сейчас буду писать код)
но тогда смотрел) я немного не пойму саму соль этого)
я бы хотел с вами пару минут поговорить на эту тему может вы меня в правильную сторону направите)))))))))))))))
@@thecatwrites9731 Знаете, для меня, любое самое крутое объяснение - обязательно болжно быть дополнено написанием кода собственными руками (часто многократным...).... Без это никак. Напишите сами - без подсказок, поставьте логи - и все встанет на свои места:)
@@stackdev спасибо за хороший совет!!!
переменная grazhdanin как-то не по феншую. Плохому учите.
Grazhdanka XD
Непонятно объясняешь
function outerData(){
if(oData.convert_to === "ft"){pereshetka = oData.value * 3.2808;
console.log('GGGGGGGGGG',pereshetka);
}
return pereshetka;
}
Доброго ввечора есть функция - а в из нее нужно как то достать доступ до переменной в глобальную область видимости когда делаю как у Вас подсказано - console.log віводіт undefined.
var pereshetka=0;
oAJAX = new XMLHttpRequest();
oAJAX.open("GET","data.json", true);
oAJAX.onreadystatechange = function () {
var oData;
//const accessToInner = outerData();
var oOutput = document.getElementById("info");
if ((oAJAX.readyState == 4) && (oAJAX.status == 200)) {
var oData = JSON.parse(oAJAX.responseText);
function outerData(){
if(oData.convert_to === "ft"){pereshetka = oData.value * 3.2808;
console.log('GGGGGGGGGG',pereshetka);
}
return pereshetka;
}
//const result = {unit: oData.convert_to, value: convertFunction(oData.distance.value, oData.distance.unit, oData.convert_to)}
{
//console.log(' Hello', result);
var oP;
var Dlinacount = oData.distance.lenght;
for (i in oData.distance ){
console.log(oData.distance[i]);
console.log('HERNA', oData.distance.value);
if (!oData.distance.value) {
break;
}
else{
console.log(oData.distance)
oP = document.createElement ("p");
console.log(oData.distance[i])
oP.textContent = oData.distance.unit + " " + oData.distance.value;
oOutput.appendChild(oP);
}
}
}
const mygav = outerData();
console.log('HAHGAHAHAHA',mygav);
}
}
oAJAX.send();
Только родительская функция так и останется в стеке, и не важно "работает" она или нет. Всё её локальные переменные и параметры останутся в стейке пока она не вернёт управление. Неудивительно, что внутренняя функция будет "видеть". Только в JS это вызывает дикий экстаз... Да, и Closure не переводится, как Замыкание с английского....
Спасибо, очень доступно!
Спасибо!