Что такое и как работают замыкания (closures) в JavaScript?

Поделиться
HTML-код
  • Опубликовано: 4 фев 2025

Комментарии • 96

  • @PurpleSchool
    @PurpleSchool  2 года назад +5

    🎉 Новый курс - Основы JavaScript: purpleschool.ru/course/javascript-basics

  • @UserName32048
    @UserName32048 Год назад +1

    Вот теперь стало понятно, спасибо!

  • @homelander973
    @homelander973 3 месяца назад

    прекрасное объяснение как всегда Антон

    • @PurpleSchool
      @PurpleSchool  3 месяца назад

      @@homelander973 спасибо!

  • @mamaimdeveloper
    @mamaimdeveloper Год назад +1

    Как же доходчиво!

    • @PurpleSchool
      @PurpleSchool  Год назад

      Спасибо

    • @Александр-ш8я6н
      @Александр-ш8я6н Год назад

      А что здесь доходчивого? Почему в change мы можем передать аргумент хотя changeBalance, которая присваивается change не принимает аргументов, какой то трэш, здесь происходит искажение локальных областей видимости функции, нужно уточнить что в change лежит то , что возвращает функция changeBalance а не сама функция changeBalance

  • @DronVol
    @DronVol 2 года назад +8

    Я бы с удовольствием про контексты послушал, а так же про их привязку)

    • @PurpleSchool
      @PurpleSchool  2 года назад +2

      Это всё есть в курсе, может сделаю отдельное видео как-нибудь

  • @bushkov
    @bushkov 2 года назад

    О, прикольно! Как раз думал когда выйдет курс по js и вот! Уже купил.

    • @PurpleSchool
      @PurpleSchool  2 года назад

      👍

    • @bushkov
      @bushkov 2 года назад

      @@PurpleSchool Антон, подскажите, когда будет готова вторая часть курса? Я уже прошел 10% базового курса и поэтому полагаю, что смогу завершить все за 2-3 недели. Поэтому хотелось бы сразу перейти ко второй части. Или уже на этом уровне можно сразу к Typescript? Спасибо.

  • @ndrewhas
    @ndrewhas Год назад +1

    Годно, спасибо 🔥

  • @Quentinrei
    @Quentinrei 2 года назад

    Крутой контент 🎉

  • @МаксимИсаев-ъ5о
    @МаксимИсаев-ъ5о 2 года назад

    Моё почтение!

  • @rusfungame
    @rusfungame 2 года назад

    2 года учу js, такого обьяснения еще не встречал

    • @PurpleSchool
      @PurpleSchool  2 года назад

      Надеюсь полезного?)

    • @rusfungame
      @rusfungame 2 года назад

      @@PurpleSchool Конечно!

  • @yyanasolyah
    @yyanasolyah 2 года назад +2

    Спасибо за видео! Хотелось бы в будущем увидеть видео про микро и макротаски;)

  • @johnsnow6041
    @johnsnow6041 2 года назад

    Несколько раз пересмотрел

  • @noyut_lydi_na_verblude
    @noyut_lydi_na_verblude Год назад +1

    Очень полезно) есть ли у Вас видео об утечках памяти?

    • @PurpleSchool
      @PurpleSchool  Год назад

      Есть анализ утечки памяти в курсе по Node.js и разбор всех инструментов: purpleschool.ru/course/nodejs

  • @CCSIB
    @CCSIB 2 года назад

    Круто, не знал. Хорошо бы практические примеры, пока придумал что можно считать сумму, среднее и кол-во, например заказов и хранить в контексте. Нужно попробовать.

    • @PurpleSchool
      @PurpleSchool  2 года назад

      Рад, что было полезно)

  • @aidarb9318
    @aidarb9318 2 года назад

    thanks man

  • @raff_m_d6971
    @raff_m_d6971 2 года назад

    Ждемс ещё

  • @diggerdog001
    @diggerdog001 2 года назад +5

    Антон, я вот выбрал твой курс (я в js ноль в данный момент) как первый курс по JS и уже на первых уроках ты произносишь слова, которые новичок не может знать. Например, в разделе что такое JS, ты разбираешь где еще кроме браузера используется JS, там есть такие слова как нативные компоненты, какие то потоки (??), API, React Native, парсинг, компилирование, как будто пытаешь доказать что ты профессионал, хотя мы и так это знаем (извини если грубо написал). Для тебя понятно что эти вещи и пояснения элементарны, только не думаю что это == по отношению к новичкам. Я только начал, а уже голова начинает закипать о доп. информации которую ты не объясняешь, хотя написано что курс подходит для новичков :( Может дашь какой то совет? Может перед твоим курсом что-то другое пройти? Всё таки JS это основа основ после html/css

    • @PurpleSchool
      @PurpleSchool  2 года назад +2

      Основа основ. Я просто даю дополнительный контекст, который пока не влияет на простые концепции, которые мы разбираем. Двигайся просто медленно по урокам

    • @diggerdog001
      @diggerdog001 2 года назад +4

      @@PurpleSchoolпонял спасибо, грубо не хотел написать. Просто хотел высказать тебе обратную связь

  • @АнтонСурыгин-ф9ж
    @АнтонСурыгин-ф9ж Год назад +1

    Если бы можно было прикладывать аудио, то я бы приложил скрип своего мозга 😁
    Но вроде какое то понимание появились 😀

  • @Zadorozhniy39
    @Zadorozhniy39 2 года назад

    Спасибо 👍🏼

  • @asifabbasov3801
    @asifabbasov3801 Год назад

    Вопрос не по теме.
    Что за тему вы используете в VS Code?

  • @МаксимБурый-с7ч
    @МаксимБурый-с7ч 2 года назад

    Ни где нет информации. В каждом браузере есть свои кнопки переход на предыдущую страницу и обратно. Но есть такая штука как куки, при возврате куки не восстанавливаются, из-за чего ломается страница. Что делать? Сохранять историю переходов с куками?

  • @АлексейБатищев-щ3ч
    @АлексейБатищев-щ3ч 2 года назад

    Правильно ли я понял, что после каждого вызова запоминается пред результат и прибавляется к итоговой сумме?

    • @PurpleSchool
      @PurpleSchool  2 года назад

      Оно всегда храниться в связанном scope и к нему обращается

  • @N5O1
    @N5O1 2 года назад +1

    8:43 замыкания - инкапсуляция из мира JS

    • @PurpleSchool
      @PurpleSchool  2 года назад

      Да, но у нас есть в JS и более явные механизмы: приватные переменные, IIFE

    • @АндрейСорокин-ь6ъ
      @АндрейСорокин-ь6ъ 2 года назад

      @@PurpleSchool IIFE всегда воспринимал как костыль, сочиненный ввиду отсутствия альтернативы. Интересно ваше мнение

    • @PurpleSchool
      @PurpleSchool  2 года назад

      Он действительно костыль, сейчас практически не используется (кроме разовый запусков инициализации приложения, но не как инкапсуляция).

  • @vit944
    @vit944 Год назад

    Антон, подскажите, а где на практике во фронтенде применяются замыкания?

    • @PurpleSchool
      @PurpleSchool  Год назад

      Осознанно практически нигде, так как данными из замыкания напрямую нельзя управлять.

    • @тимур_атмосферный
      @тимур_атмосферный Год назад

      @@PurpleSchool Супер

    • @sjdjjsjsjs3991
      @sjdjjsjsjs3991 6 месяцев назад

      @@PurpleSchool я во фронт пошел, чтобы кнопки красить, какие еще замыкания? 😂

  • @fedordostoevskiy4209
    @fedordostoevskiy4209 2 года назад

    Классно. Но друзья прочитайте Симпсона про замыкания. Я с третьего раза сам полностью въехал только. Там не прям уж 'wow', но ни один ролик или статья столько не дал мне.

  • @sergio_an_2003
    @sergio_an_2003 2 года назад

    Круто! Оч информативно. А какая тема стоит в vs code?

  • @pintofale
    @pintofale 2 года назад

    Спасибо за видео! Подскажите пожалуйста - в Вашем курсе ведь нет ничего про асинхронные операции? Это будет в каком-нибудь "продвинутом" курсе?

    • @PurpleSchool
      @PurpleSchool  2 года назад +1

      Да, будет во второй части, которая продолжает первый курс.

  • @valeriyosokin1076
    @valeriyosokin1076 2 года назад

    У замыканий есть накладные расходы при создании и запуске. По сути, при создании замыкания создается объект. Не забываем что в JS функция это объект. В примере создано 2 экземпляра объекта функции. А если будет необходимо создать сотни? И как всем этим управлять?

    • @igorchesnokov482
      @igorchesnokov482 Год назад

      Ну и случится замыкание :) Только в голове :))))

  • @РоманЯгжин-щ4к
    @РоманЯгжин-щ4к Год назад

    change это по сути changeBalance. У changeBalance нет аргументов. Каким образом аргумент переданный в change(100) передаётся в функцию и затем судя по всему передаётся в анонимную функцию вместо sum? У меня вот после просмотра видео сложилось впечатление, что замыкание - это когда одна функция возвращает другую функцию и возвращаемая функция замыкает родительскую и поэтому типа замыкание))) Механизм передачи параметров вообще не понятен.

    • @КеримКорголоев-б3е
      @КеримКорголоев-б3е 11 месяцев назад

      Ты выполняешь функцию в ченж, тем самым возвращаешь анонимную функцию с параметром и переменную баланс

    • @novichok3417
      @novichok3417 11 месяцев назад

      ​@@КеримКорголоев-б3еа что будет если присвоить перем ченж функ ченжбаланс без вызова (без скобок) . А потом запустить ченж с разными параметрами три раза?

    • @КеримКорголоев-б3е
      @КеримКорголоев-б3е 11 месяцев назад

      @@novichok3417 Для тебя ничего не произойдёт. А так переменная ченж будет указывать на функцию ченжбаланс. Но ты можешь выполнить функцию ченж с двумя скобками: ченж()(100). Тогда ты по сути повторишь тот же код, что и в примере на видео. Попробуй вариант из видео и свой вариант, но выведи в консоль ченж, чтобы узнать, что в ней содержится

    • @novichok3417
      @novichok3417 11 месяцев назад

      @@КеримКорголоев-б3еи где тогда как сказать эффект накапливания?
      ченжбаланс()(100);
      ченжбаланс()(2000);
      ченжбаланс()(3500));
      Дадут результат:
      100, 2000, 3500. А не
      100, 2100, 5600.

  • @CCSIB
    @CCSIB 2 года назад

    И надо попробовать внутри объекта vue с методами vue будет ли работать, скорее всего да.

    • @PurpleSchool
      @PurpleSchool  2 года назад

      Vue же это просто JS фреймворк, потому везде где есть JS работаю будет)

  • @godlikex_alex
    @godlikex_alex 2 года назад

    название темы не подскажите?)

  • @koshmar1319
    @koshmar1319 2 года назад

    а рекурсия будет на курсе?

    • @PurpleSchool
      @PurpleSchool  2 года назад

      Да, в этом курсе она используется в тестах и рассматривается как пример переполнения стека.

  • @OleksiiMalichenko
    @OleksiiMalichenko 2 года назад

    А где все коменты?

  • @михаиландреев-й3ъ
    @михаиландреев-й3ъ 4 дня назад

    Простыми словами: функция помнит свой outer , как у прототипа, на самом деле не правильная структуирована гистограма, анонимная функция в своем контексте не найдет balance, поэтому пойдет искать у своего родителя (changeBalance) , нету никакой магии увы

  • @mooncorizer290
    @mooncorizer290 Год назад

    Зачем называть замыканием, когда обьект с приватной переменной и методом что её меняет, помещают в переменную и пользуются его методами меняя приватное значение. Почему именно замыкание. Где можно почитать официально об этом а не в википедии

    • @PurpleSchool
      @PurpleSchool  Год назад

      developer.mozilla.org/ru/docs/Web/JavaScript/Closures

  • @serdotsenko
    @serdotsenko 2 года назад

    я так предпологаю, что замыкания придумали до классов, т.к. по сути это класс с приватным полем, которое меняет метод этого класса 😉

    • @PurpleSchool
      @PurpleSchool  2 года назад +1

      Да, они были до классов)

  • @user-glory-of-ukraine
    @user-glory-of-ukraine Год назад

    Автор Ангулярщик?)

    • @PurpleSchool
      @PurpleSchool  Год назад

      Ну я писал пару лет на AngularJS, потом на Angular, потом React и Svelte. Vue больше для интереса, а не для прода.

  • @limonred5283
    @limonred5283 Год назад

    почему это выглядит как дичь?)))

  • @N5O1
    @N5O1 2 года назад +1

    Это самая бесполезная информация, которую нужно знать JS\TS разработчкину.
    Замыкания - это инициализированные внутри функции\облати видимости переменные

    • @PurpleSchool
      @PurpleSchool  2 года назад +2

      Проблема, что многие не понимают работу замыканий и допускают ошибки при работе.

  • @denisshulga7539
    @denisshulga7539 Год назад

    Ничо не понятно)

  • @romanmed9035
    @romanmed9035 2 года назад

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

    • @PurpleSchool
      @PurpleSchool  2 года назад +1

      Эх, я так старался. По сути замыкание - это функция и окружение где она была создана и связь между этим.

    • @CJIu3eHb
      @CJIu3eHb 2 года назад

      Как дополнение, хочу акцентировать внимание именно на сборщике мусора. После выполнения порождающей функции в замыкании возвращаемой функции (ее внешнем скоупе) остается только то, что используется в возвращаемой функции, т.к. эти переменные еще понадобятся для выполнения возвращаемой функции. А то, что было только внутри порождающей и нигде больше не понадобится - после выполнения порождающей доступно для чистки сборщиком мусора. Ну и не забывать, что каждое выполнение порождающей создает новый скоуп для возвращаемой. Именно это позволяет иметь независимые балансы при создании нескольких функций changeXXX в примере видео.

    • @romanmed9035
      @romanmed9035 2 года назад +1

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

    • @romanmed9035
      @romanmed9035 2 года назад +1

      @@CJIu3eHb премного благодарен за дополнение

  • @progtime2000
    @progtime2000 2 года назад

    Уснуть можно...

  • @victormog
    @victormog 2 года назад +1

    Слишком затянул, IMHO
    (тут на много проще: ruclips.net/video/RPuFz93Gvpk/видео.html )

    • @PurpleSchool
      @PurpleSchool  2 года назад +2

      Тут не рассказана механика с точки зрения scope и привязки. Потому люди и не понимают почему так происходит

    • @АндрейСорокин-ь6ъ
      @АндрейСорокин-ь6ъ 2 года назад +1

      интересная логика, тебе можно пойти тогда к хауди хо, он тебе весь js за час расскажет) без обид)

    • @victormog
      @victormog 2 года назад +1

      @@АндрейСорокин-ь6ъ логика элементарная - если видео обучающее, то где понятнее?
      Лично я, если бы уже не знал, не понял бы ничего...