JavaScript Closures in FIVE Minutes

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

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

  • @chetanjain4616
    @chetanjain4616 2 года назад +35

    To my limited knowledge what you explained is lexical scope which is part of closure but closure is little more complex than that, maybe a reference of Dave Gray's video will help a little

    • @JamesQQuick
      @JamesQQuick  2 года назад +9

      I think the addition to lexical scope here is the fact that the function isn’t called immediately. It’s called at some later time and still has access to the variables. Lexical scope would more specifically refer to the case where you are accessing the data right then (not at a later point) I believe.

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

      The best usage of closures is to create private variables I think.

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

      @@rafalka7084 encapsulation would be the better term but yeah

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

      Yes you're right, you also need to understand the concept of the call stack and function execution contexts and how these two are *determined dynamically* by how the function is *called* at runtime, as opposed to how lexical scope is *determined statically* by where the function is *defined* (in the code) at compile time. This is important as you'll often see popular articles mix up the terms, execution context and scope, which will get really confusing as you try to understand how it all works under the hood of the JavaScript engine/interpreter.

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

    Thought it was more about if you keep a reference to a function, and that function has a reference to something that is out of scope of the first reference, the second reference is available as long as the first reference still exists?

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

      Yeah I mean that's basically the same thing here. Any time something is referenced inside of a function that isn't called until later, the fact that it keeps the reference is it.

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

    Great Video ❤❤❤

  • @Paul-wy6tn
    @Paul-wy6tn 2 года назад

    Straight to the point, cheers mate

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

    I use that pattern all the time. I have a web app which uses handlebars for the frontend, and there are many pages where there's a list of items and I need to add event listeners to each one - so this comes in handy

  • @ste-fa-no
    @ste-fa-no 2 года назад +4

    Simple 👏Worth noting that if you instanciate a "const n = Math.random()" each button will have its own different "n", but always the same "n" for every click on a singular button

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

      If it’s inside of the for each yes you are correct!

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

    Can any one tell what theme is he using? Does he share his settings.json?

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

    The video was amazing thank you so much. Plus, I really love your theme and your font, I do love to know and use it thank you so much.

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

    Does anyone know what VS Code theme this is? I don’t believe this is the regular Cobalt 2 that he normally uses.

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

      Found it - Midnight Synth

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

    Hey James, what theme, font are you using? Also, did you do any changes in the default theme you used? Thanks James, keep up the good work. Hoping to watch your next video soon

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

      I was scrolling the comment to see who has asked the theme question. It's beautiful. James, I need it too. Thanks for your videos.

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

      I use the font Cascadia Code.
      I’m using VS Code with the Cobalt 2 Theme.
      It's in the Advent Page he mentioned, worth checking.

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

      I think I found it - Midnight Synth

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

    I don't understand how the i parameter in the forEach was actually logged out since you didn't define it in the addEventListener.

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

    Great video and explanation.

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

    That was solid 5 minutes.. thank u sir

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

    what is this vs code theme

  • @digital-accolades
    @digital-accolades 2 года назад

    Thank you James.

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

    That's it !!...loved it !

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

    Thanks, great video!

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

    Love your videos, Thanks so much ❤

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

    This is awesome 💚

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

    But why does "i" increment?

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

    I've been using closures for years without even knowing that's what they were. lol.

  • @231-o5m
    @231-o5m 2 года назад +1

    good

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

    Your videos are awesome as your vs code theme, can you share the theme plz🙈

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

    I use closures but not very frequent. Generally, your guide is good. Keep going.

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

    Vs code theme please ...

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

      I use the font Cascadia Code.
      I’m using VS Code with the Cobalt 2 Theme.
      It's in the Advent Page

  • @bmehder
    @bmehder 2 года назад +3

    I think this is one of the best explanations of closures I have come across.

  • @deepakishere-e1d
    @deepakishere-e1d 2 года назад

    thanks

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

    sry, but is it fullhd or no?

  • @lexsemenenko
    @lexsemenenko 2 года назад +3

    I have a vague understanding of closures, but this example does not explain closures at all in a way it is commonly used.

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

      Hmm anything you’d like to add or clarify?

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

      ​@@JamesQQuick In a foreach loop, in each iteration, the index is accessed from the inner function simply by the rules of scope. Function scope - meaning everything inside has access to it. Closure: an inner function always has access to the variables and parameters of its outer function (Yes), and the mind blowing fact is when it's in a situation after the outer function has already returned. But the values are remembered to be accessed after the outer fn return. The magic point of it. ) So the idea of private variables comes from this magic feature. I've seen examples of it where it was difficult to wrap my mind around it. Sorry for the confusion. It's true what the video described. But just there are deeper meanings I believe.

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

      @@lexsemenenko I appreciate the detailed response. Agreed there are deeper implications and use cases than what's covered in the quick video

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

    your explanation is a bit cryptic. I use closures a lot and I can somehow figure out what you are trying to say, but your tut lacks enough explanation to be able to grasp it the way it is explained. Perhaps you are using it in a way I have never used it, so pardon my ignorance in that case, but I am still puzzled.

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

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

    3:13 wtf is a callback listener, try use simple language in a tutorial

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

    in 2x speed for 2.5min

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

    That was sooooo simple wow thanks a lot