Lydia Hallie
Lydia Hallie
  • 5
  • 949 070
JavaScript Visualized - Closures
Learn what closures really are behind the scenes! Let’s break it down with visualized examples, a little quiz, and some use cases. If you're newer to JavaScript, I highly recommend you check out more general resources on closures first; it might be a little intimidating to watch this if you don't have that knowledge! 🙏
- www.patreon.com/LydiaHallie
- buymeacoffee.com/lydiahallie
- lydiahallie
- www.linkedin.com/in/lydia-hallie/
- theavocoder
Timestamps:
0:00 Intro
0:18 Execution Contexts and Environment Records recap
1:37 Function Objects
2:44 Closures
5:54 Closures Recap
6:22 Quiz
8:45 Use cases
10:55 Outro
มุมมอง: 52 565

วีดีโอ

JavaScript Visualized - Execution Contexts
มุมมอง 70K6 หลายเดือนก่อน
Learn how JavaScript handles code execution through execution contexts and environment records, including features like hoisting, the scope chain, and closures! - www.patreon.com/LydiaHallie - buymeacoffee.com/lydiahallie - lydiahallie - www.linkedin.com/in/lydia-hallie/ - theavocoder Timestamps: 0:00 Intro 0:15 Execution Context Overview 1:26 Realm 1:51 Intrinsics 2:0...
JavaScript Visualized - Event Loop, Web APIs, (Micro)task Queue
มุมมอง 632K7 หลายเดือนก่อน
Learn how the browser event loop, task queue, microtask queue, and Web APIs work together to enable non-blocking, asynchronous JavaScript. - www.patreon.com/LydiaHallie - buymeacoffee.com/lydiahallie - lydiahallie - www.linkedin.com/in/lydia-hallie/ - theavocoder Timestamps: 0:00 Intro 0:32 Call Stack 1:18 Single-threaded Problem 2:01 Web APIs 2:47 Callback-based APIs ...
JavaScript Visualized - Promise Execution
มุมมอง 181K7 หลายเดือนก่อน
Learn about the inner workings of Promises in JavaScript and see how they enable non-blocking asynchronous operations. - www.patreon.com/LydiaHallie - buymeacoffee.com/lydiahallie - lydiahallie - www.linkedin.com/in/lydia-hallie/ - theavocoder Timestamps: 0:00 - Intro 0:19 - Promise Constructor 4:42 - Chaining thens 6:26 - Challenge 8:05 - Outro

ความคิดเห็น

  • @luizadolphs6084
    @luizadolphs6084 58 นาทีที่ผ่านมา

    I see someone going straight to the point I like and follow

  • @jakubsowikowski9654
    @jakubsowikowski9654 9 ชั่วโมงที่ผ่านมา

    What a great video! I am impressed by how easily you explained this topic. You must have spent so much time on this presentation. A big thank you :)

  • @peterbahrynovskyi1691
    @peterbahrynovskyi1691 19 ชั่วโมงที่ผ่านมา

    Continue making videos, you have a real talent!

  • @SomakChakrabortyakaMak
    @SomakChakrabortyakaMak วันที่ผ่านมา

    Thank you so much for this awesome explanation with animation!

  • @KVG_
    @KVG_ วันที่ผ่านมา

    Just wow. I'm a beginner, and I came from The Odin Project. This is the best video tutorial I've seen so far for such a complex topic. The visualization is just perfect. Some senior devs in comments said that they finally understood this topic thanks to your video after years working in this industry and I've got it already in the learning process and it feels so good. Thank you.

  • @Maelton_Lima
    @Maelton_Lima วันที่ผ่านมา

    Excellent content and explanation, congratulations for your work!

  • @Maelton_Lima
    @Maelton_Lima วันที่ผ่านมา

    Excellent content and explanation, congratulations for your work!

  • @pythonismyvice-fo5bz
    @pythonismyvice-fo5bz วันที่ผ่านมา

    I was looking for an explanation of new Worker() and got to this video from google search. Was disappointed.

  • @RohanDagale-m9c
    @RohanDagale-m9c 3 วันที่ผ่านมา

    she's literally GOD for JS developers. 😭😭

  • @SonNguyen-tp2dm
    @SonNguyen-tp2dm 4 วันที่ผ่านมา

    omg the animation is so clear, subscribed

  • @mshayanali427
    @mshayanali427 4 วันที่ผ่านมา

    Amazing videos giving good insights. Please also upload some videos on other topics like generator functions and other important topics.

  • @YoussefAdelWahba
    @YoussefAdelWahba 4 วันที่ผ่านมา

    thanks for such amazing lecture.

  • @YoussefAdelWahba
    @YoussefAdelWahba 4 วันที่ผ่านมา

    Queen

  • @JohnWick-c3o
    @JohnWick-c3o 4 วันที่ผ่านมา

    But who will decide the setTimeout and all promises will sent to the microtask and callback queue?

  • @wannabeaninterpreter
    @wannabeaninterpreter 5 วันที่ผ่านมา

    Promise.resolve() .then(() => console.log("for this ")); setTimeout(() => console.log("tutorial"), 10); queueMicrotask(() => { console.log("amazing ") queueMicrotask(() => console.log("JavaScript ")) }); console.log("Thank you ")

  • @frontendlogic
    @frontendlogic 5 วันที่ผ่านมา

    I never understood this concept until i ran into this video. Thanks a lot

  • @zain910128
    @zain910128 5 วันที่ผ่านมา

    How do you animate your slides like that ?

  • @georgeclaphamholguin7087
    @georgeclaphamholguin7087 6 วันที่ผ่านมา

    Awesome explanation!

  • @fredoverflow
    @fredoverflow 6 วันที่ผ่านมา

    TLDW inner functions can access variables of their outer function. You're welcome!

  • @angeloc700
    @angeloc700 6 วันที่ผ่านมา

    Nice work!!

  • @GlobalGuider
    @GlobalGuider 7 วันที่ผ่านมา

    thanks for clearing this mess

  • @virgilio.chiboleca
    @virgilio.chiboleca 7 วันที่ผ่านมา

    If you don't understand this here, you need to repeat it over and over, because this is by far the best explanation on the entire internet for this topic.

  • @PloddingDream-px3fz
    @PloddingDream-px3fz 7 วันที่ผ่านมา

    This is a flawless presentation. I haven't found a single resource even mentioning the promise reaction record.

  • @王宁宁-i9u
    @王宁宁-i9u 8 วันที่ผ่านมา

    crystal clear

  • @felm-c7e
    @felm-c7e 8 วันที่ผ่านมา

    I wish you had 500 videos like this. wow.

  • @sirdragoon4625
    @sirdragoon4625 9 วันที่ผ่านมา

    Girl with 4 banger videos then disappear..........

  • @2098ramkumar
    @2098ramkumar 9 วันที่ผ่านมา

    3:33 if Lydia Hallie wants to know my location, she can 😏

  • @csgameng1128
    @csgameng1128 10 วันที่ผ่านมา

    I finally get it 🥲

  • @justiceessiel6123
    @justiceessiel6123 10 วันที่ผ่านมา

    I am trying to teach cryptography would love to have a chat so we collab so you help with this kinds of visuals. its a game changer

  • @ashutoshshukla1783
    @ashutoshshukla1783 11 วันที่ผ่านมา

    Too good

  • @br3ak_
    @br3ak_ 13 วันที่ผ่านมา

    7:05 Things get a bit unclear when moving on from the Global EC to the function's EC (greet). You say here that the Lexical Environment "contains" a Function environment record, but in the case of the Global EC the Lexical Environment "pointed" to the Global environment record, which in turn handled different variable declarations with the Object Record or the Declarative Record depending on how they were defined. Also from what I can tell the Variable Environment dissapears altogether? Aaaand why is it that a Function EC "contains" an [[OuterEnv]] property, instead of pointing to a Function Environment Record that contains that [[OuterEnv]] property (similar to how it's done in the case of the Global EC) ? These tiny discrepancies are not addressed, I am sorry, don't mind me, I am already at my 12th run through the video (preparing for interviews) and my questions may be a bit too picky haha.

  • @UmeshNeupane-1001
    @UmeshNeupane-1001 14 วันที่ผ่านมา

    what about the global execution context in call stack? should it also be empty?

  • @RonnieDenzel
    @RonnieDenzel 14 วันที่ผ่านมา

    Just found a new channel to subscribe to,these explanations are a solid💯

  • @AhmedMohamed-qg3pd
    @AhmedMohamed-qg3pd 14 วันที่ผ่านมา

    best way I've ever seen anyone explain anything in my entire life. I'm speechless!

  • @milos2785
    @milos2785 14 วันที่ผ่านมา

    What a brilliant girl! I could only imagine the process of coming up with visuals for this video, they are amazingly simple to understand! And they are also in sync with your commentary! Wow! 🧡

  • @trupti0406
    @trupti0406 14 วันที่ผ่านมา

    This is so good??? I have watched 40-minute-long videos on Event loop and could not get an idea of what goes on in the background, the efforts it must've taken to create something so good! Commendable work ma'am. This is the best explanation out there for the event loop!

  • @pranavgoel29
    @pranavgoel29 14 วันที่ผ่านมา

    Loved how you presented it really helpful 😊

  • @trycatchangler
    @trycatchangler 14 วันที่ผ่านมา

    Thank you, this was very informative!

  • @dusaripreethi4612
    @dusaripreethi4612 14 วันที่ผ่านมา

    I immediately subscribed after watching this video , So awesome explanation and made my day . That DOPAMINE hit after understanding the concept which gave you headache . Thank you so much ❤

  • @SothearithKONGMrMuyKhmer
    @SothearithKONGMrMuyKhmer 14 วันที่ผ่านมา

    Hi Lydia, any advice for a beginner to learn JavaScript. I could learn and understand html and css effortlessly (self-taught) but when it comes to JavaScript, usually get stuck. Thanks in advance!

  • @brilliancerobotics9242
    @brilliancerobotics9242 15 วันที่ผ่านมา

    Thank you Lydia. It really helped. So far the best explanation.

  • @anipetrosyan4255
    @anipetrosyan4255 15 วันที่ผ่านมา

    perfect, thank so much

  • @bishopoftroy
    @bishopoftroy 16 วันที่ผ่านมา

    This defeats its own purpose. Your explanation is so convoluted that i need to first understand what closures are in order to understand your explanation of what closures are. Also in that callstack representation i counted more than 20 rectangles. I just can`t follow this presentation. It`s like i`m looking at a microchip scheme and expect to know how the current is flowing. But yea, i appreciate the effort. Looks like i`m not that smart for learning this programming stuff.

  • @ArtemiiKarkusha
    @ArtemiiKarkusha 16 วันที่ผ่านมา

    The best explanation and lesson I have ever seen. Visualisation is extremely amazing. Your explanation and sound is very clear.

  • @bernard0camp0s
    @bernard0camp0s 17 วันที่ผ่านมา

    Really awesome visuals. Congrats!

  • @thrinathgaddam-yz4mq
    @thrinathgaddam-yz4mq 17 วันที่ผ่านมา

    You are a gem

  • @m65917
    @m65917 18 วันที่ผ่านมา

    Amazing video ! I've been a NodeJS developer for 8 years now and I didn't know this in details ! Awesome ! Its also great to see new faces in the IT video ecosystem, specially women who are under represented. And the animations are awesome ! Thank you for the work

  • @SouravKanoliya
    @SouravKanoliya 18 วันที่ผ่านมา

    😍 Nice tutorial, apart from this you look exactly like Captain Marvel 😍

  • @ericoliveira1
    @ericoliveira1 18 วันที่ผ่านมา

    Excellent explanation. Thanks for sharing.