Замыкания в JavaScript с примерами. Фундаментальный JavaScript

Исторически тема замыканий (closure) одна из самых труднопонимаемых в JavaScript. Поэтому в этом видео мы разберем ее максимально подробно - порисуем и разберем несколько примеров.
По сути, когда речь идет о замыкании, это значит, что какая-то функция в результате своей работы возвращает (через оператор return) новую функцию, которая в свою очередь "запоминает" всю информацию об окружавших её переменных. Давайте разбираться!
#javascript #замыкание
__
Мои курсы по вебу с купонами:
✅ mishanep.com/
📢 Поддержка канала:
/ mishanep
www.tinkoff.ru/rm/nepomnyasch...
paypal.me/mishanep

[@tanyatritelnitskaya1911]

Отличное видео, которое показывает, как все работает изнутри, а это и есть самое важное! Спасибо большое!!!

[@pfk9025]

Молодец, что в объяснении затронул Scopes. Спасибо!

[@alexey_samokhin]

Способ, с помощью которого я навсегда запомнил замыкания - это сравнение их с рюкзаком. Когда функция создана и передаётся куда-либо, или возвращается из другой функции, то она носит с собой рюкзак. А в этом рюкзаке хранятся все переменные, которые были в области видимости во время создания этой функции.

[@JackSteamBoy]

это называется [[scope]]

[@Ivan-ee4pz]

Это самое лучшее объяснение замыкания в моей жизни, спасибо тебе огромное

[@etemax]

так можно ответить на собеседовании?))))

[@OneMrZlodey]

Нужно :)
@@etemax

[@user-kq5ow1zv3m]

спасибо за объяснения работы замыкания изнутри!было интересно,нужно еще пару раз посмотреть чтобы все уловить)

[@____Olga__]

спасибо за [[Scope]]. Инсайт!

[@alsusayfulina1865]

Михаил, спасибо большое, очень интересное и понятное объяснение 👍

[@ekaterinaskrynnik6932]

Спасибо большое за ваши старания ! С вашими уроками учёба становится легкой и супер интересной !

[@RewCSharp]

Спасибо за урок!

[@mityadima]

Нашел замыкания, спасибо

[@unknown.6914]

Лично у меня получилось понять замыкания, когда я продебажил все строчки кода и увидел как ведет себя js. Какая у него последовательность действий и что именно делают эти действия. Может кому-то это тоже поможет. Всем удачи! Михаилу спасибо за полезный контент.

[@surr3955]

Круто, спасибо! Давно хотел понять что такое мемоизация - как раз созрел )

[@AndrewFloatrx]

мемоизация не может возвращать один и тот же результат всегда... все должно зависеть от аргументов, которые вы передаете в ф-цию... из аргументов мы получаем что-то типа хэша или просто JSON.stringify(args) - и используем это значение как вычисляемый ключ, для хранения результатов... как-то так...

[@stanislavasgoldyckis7740]

Спасибо

[@yantakushevich1014]

отлично объясняешь, голос приятный. Молодец!

[@sergeyzatsepin513]

Спасибо!

[@agataageeva424]

Спасибо)

[@glaciron]

Круто

[@user-ud3ze6wy2j]

Просто лучший!

[@user-ud3ze6wy2j]

В последнем примере, получается что функция замыкает в себе состояние? сильно, прям будто локальный стейт компонента во фреймворке. Я правильно понимаю?

[@mr.listok]

спасибо)

[@user-hm1kc3zo9r]

Приятный голос)

[@nastenaozu]

чел...))))))))))

[@user-hm1kc3zo9r]

@@nastenaozu ахаххаахха

[@user-qi6vq3gb9s]

Я так и не пойму, контекст или же скоуп, это одно и тоже, что стэковый фрейм функции?(как в c# к примеру
)

[@user-jj3zm1jx7z]

вау

[@v.demchenko]

Было бы хорошо обсудить пример с каунтером.
function useCounter() {
let state = 0
function inc() {
state++
}
function dec() {
state--
}
return [state, dec, inc]
}
counter // 0
increment()
counter // 0
Как сделать так, что бы возвращалось обновленное значение каунтера?
P.s. функцию не предлагать.

[@jefryredgenaldchen3936]

function useCounter() {
let state = 0
return {
inc: function () {
state++
},
dec: function () {
state--
},
value: function () {
return state
},
}
}
const result = useCounter()
result.inc() //1
result.inc() //2
result.dec() //1
console.log(result.value()) //1
P.S. тебе наверное уже не актуально, но вдруг кому пригодится
P.P.S сам новичок поэтому, если что не так, то сильно не пинайте

[@v.demchenko]

@@jefryredgenaldchen3936 в реакте ты не функцию получаешь. Так не годится)

[@jefryredgenaldchen3936]

@@v.demchenko а ну так я до реакта еще даже не добрался)) говорю ж - новичок, так балуюсь))

[@user-hj3zu5tk4h]

В самом первом примере, консоль выводит ошибку: Uncaught TypeError: helloWorld is not a function
Если написать такой код:
function createFn() {
function greeting() {
console.log('hello world');
}
return greeting();
}
const helloWorld = createFn();
console.log(typeof helloWorld);
helloWorld();
При этом console.log(typeof helloWorld); выдает: undefined
В чём дело?

[@mishanep]

Внутри функции createFn вы создали новую функцию и сразу ее вызвали. В результате вы вернули из createFn вместо новой функции, результат ее вызова. В данном случае undefined

[@user-hj3zu5tk4h]

@@mishanep да, но это же один в один ваш код. Только у вас показывает, что это функция, а у меня undefined. Как такое возможно, код же одинаковый?

[@mishanep]

@@user-hj3zu5tk4h значит не одинаковый. Уберите круглые скобки после return greeting

[@user-hj3zu5tk4h]

@@mishanep точно! Виноват, простите! Спасибо Вам большое!

[@user-qi6vq3gb9s]

ты для начала разберись в разнице между "Вызвать функцию" и "Передать функцию", а потом уже такие темы учи

[@AndrewFloatrx]

Чтобы лучше понимать как работают замыкания, стоит сначала разобраться как работает "сборщик мусора" в js... это напрямую связанные вещи

[@romanmed9035]

а при использовании стрелочных функций?

[@mishanep]

То же самое. Замыкание - не про стиль написания функций, а больше про скоуп создаваемых функций.

[@romanmed9035]

@@mishanep спасибо. да, я сам сделал на стрелочных. но рассказав и показав сейчас на собеседовании то что тут увидел и услышал, получил нелестную оценку от спрашивавшего. определение замыкания и его свойства и особенности несколько не так он ожидал услышать.

[@mishanep]

@@romanmed9035 а чего ожидали?

[@romanmed9035]

@@mishanep дословно не рассказано. это же не урок где можно попросить подробнее рассказать. но как я понял основной упор на контекст при создании замыкания. при решении задачи воспользовался полученным при просмотре этого видео знанием, которого оказалось недостаточным и ответ оказался совсем не верным. что-то не так с контекстом, поэтому не правильно указал что выведет функция. сохранить задание для анализа не позволили.

[@mishanep]

@@romanmed9035 Вообще, когда уверен, можно и поспорить, и уточнить что хотят. В принципе слабо себе представляю кейсы, где могло бы понадобиться использовать контекст вместе с замыканием. Замыкание больше про область видимости. Здесь больше похоже на попытку запутать.

[@ruslanhd7262]

Честно говоря я не понял, остались вопросы. Пойду дальше искать видео, где разъясняют для совсем отсталых.

[@digitalturkistan1857]

Александр лущенко

[@pogrebnoimaksim]

иллюстрация еще больше путает смотрящего... кто не понимает что такое Замыкание может еще больше запутаться... это можно лучше и проще объяснить просто на словах. Есть ролики на эту тему более развернутые. Но за видео спасибо, у вас много полезных роликов...

[@404Negative]

сижу и не понимаю зачем там ...args

[@cyrilanisimov]

Очень многословное объяснение. Уводящее внимание слушателя от сути.
Такое чувство, что жабастриптизёры сами не понимают, как работает язык

[@snailbobo]

Отвратительно

[@user-pp8lw8cx4w]

не для средних умов