Javascript Closure Tutorial | Closures Explained

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

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

  • @DaveGrayTeachesCode
    @DaveGrayTeachesCode  3 года назад +78

    Closure is often confused with Lexical Scope. Lexical Scope is an important part of closure, but it is not closure by itself. This tutorial provides several examples that should allow you to distinguish between lexical scope and closure. This tutorial should also allow you to learn how to give examples of closure if you are asked during the interview process. It is important to understand scope when we discuss closure. If you need to learn more about scope, check out my scope tutorial here: ruclips.net/video/_E96W6ivHng/видео.html

    • @siya.abc123
      @siya.abc123 3 года назад +2

      Thank you Dave ❤️

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

      Thank you for another great video Dave!

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  3 года назад +1

      @@renatoscraft you're welcome! 🙏

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  3 года назад +1

      @Abhijit Desaithank you! That's a great request 💯 I like that idea.

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

      Hi!
      Supposing you have some secret JavaScript functions that you don't want anyone to know. Also, that code (functions) are very resource consuming and this is why they need to be client side and not server side so you can't write those functions in python or php.
      Also, obfuscation of JavaScript is not useful since it can be easily deobfuscated or seen by placing a breakpoint in the debugging tools in the browser.
      This been said, could you make, please, a tutorial teaching us the best way to protect your secret JavaScript functions without paying for third party services?
      Thank you so much in advance!

  • @ukaszpospiech3817
    @ukaszpospiech3817 3 года назад +76

    Out of all the yt tutorials on closures I've watched today, this one's been by far the best. Clearly explained step-by-step with readable code as illustration. Calm voice, proper English pronunciation and slow pace of speaking matter particularly to beginners like me. Unlike most teacher-coders on yt, you're actually capable of teaching. Thank you, good job, I'm going to watch more of your tutorials.

  • @binadarabzand2701
    @binadarabzand2701 3 года назад +53

    Thank you, Dave! An extremely complex concept was explained clearly. Finally, I understood what closure is and how to use it in my code. The IIFE was a cherry on top. Thank you again.

  • @adventurer2395
    @adventurer2395 2 года назад +13

    You have a laid back, natural, and clear way of explaining things. Much appreciated!

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

    This is the first video I've come across, so far, that really goes deep into clearly explaining that simply having an inner function and logging its parents' variables isn't a closure but a lexical scope. Brilliant!

  • @aya2222
    @aya2222 3 года назад +5

    I spent the whole day looking up videos to understand closure, and finally I could find the best one. Thank you so much.

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

    I discovered you today, Dave and I am highly impressed with your teaching style. Unlike many other YT videos that teach all this stuff, I can actually understand you. (So many are hard to follow due to the thick accent of the instructor.) I'm looking forward to delving into other videos you have. Thank you!

  • @captainalpha4853
    @captainalpha4853 Год назад +5

    You explained closures in a way that even a primary school student will understand. You definitely deserve a sub. Thank You so much, Dave!

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

    I can't tell you how much I appreciate the pace of your speaking voice when explaining these concepts. So many of these youtube videos, the person is talking insanely fast, and I cannot keep up with all of it.

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

      I'm glad it helps! 💯 If anyone wants it faster, RUclips lets them speed it up 😀

  • @BigSmoke-r9w
    @BigSmoke-r9w 10 месяцев назад +1

    Dave grey taught me html and css! Now he's teaching me one of the javascript topics I find hard to understand! I love this guy, he's the best!!

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

    I has started learning web dev from your html videos ...last april .. thanx for teaching us and making begginer understand the relevant topics....

  • @DMT9023
    @DMT9023 27 дней назад

    You've earned yourself a subscriber with this video, your examples and they way you explain things clearly has helped me grasp this concept. After watching about 10 videos and reading numerous blog posts, I was really struggling to visualise what was going on. The next time I get stuck I'll be referring to your channel . Thanks Dave.

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

    Great! Great! Great! Thank you very much! Very good explanation! Very good examples!

  • @arescatalin1407
    @arescatalin1407 3 года назад +8

    I have smashed that like button and I hope that this playlist keeps growing as these concepts really make a difference. Thank you for sharing your knowledge with us

  • @SC-bv6kx
    @SC-bv6kx 3 года назад +5

    Just learned closure several days ago. This video definitely helped me review the concept. It also helped me clear up the confusion about lexical scope. Thanks Dave!

  • @m-ok-6379
    @m-ok-6379 Год назад +1

    I was writing closure example after example without really understanding the reason behind it and this video with credit example finally got the closure idea to click. Thank You.

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

    I spent the whole day looking up videos to understand closure. finally i git it so Thank you so much for clearly and simply explaining

  • @MasPensador
    @MasPensador 10 месяцев назад +1

    Finally I fully understood closure.... thank you and bless you

  • @rabahalishah5124
    @rabahalishah5124 4 дня назад

    Best closure explanation I have ever watched!

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

    감사합니다.

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

    your last example was lovely , thank you

  • @alexandra.thegreat
    @alexandra.thegreat Год назад +1

    Excellent explanation, thank very much for this video!

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

    Thank you Dave, you just got a new subscriber

  • @umairyatoo8490
    @umairyatoo8490 3 года назад +4

    Thank you very much, Dave. You explained it in a very beautiful way possible. You know I had been struggling from this since long. There wasn't any such explanation on the internet! Thanks a lot.

  • @stephaniezun
    @stephaniezun 3 года назад +4

    Thank you so much for clearly and simply explaining this concept!

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

    this is an underrated tutorial, i had to got to the bottom of the page on the youtube to get this video. these explanations & examples are more than enough to understand what closure is.

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

    This is by far the best tutorial on closures I've watched. Thank you!

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

    Thanks man, I've been struggling with this for days! This video finally made me understand closures (it gave me the aha! moment).
    I liked the way your video went beyond the cliche closure examples which weren't allowing me to actually understand practical uses for closures.
    Subscribed!

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

      Thanks again, John - check out my tutorials on debounce, throttle, and memoize to see closures put to good use, too. 🚀

  • @kostiantynkarzhanov9216
    @kostiantynkarzhanov9216 Год назад +2

    Dave, thank you so much for your tutorials! All of them are very well structured and easy to understand. I really appreciate all the work you do. Thanks again. Awesome channel! 💛

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

    The majority of videos made by other content educational creators across various websites talk like they're rappers, you sir are different. Things went much clearer after this video and made me realize that the majority of my confusion is because most of my searches were actually lexical scopes and not closures.
    I really am indebted to you.

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

    Best video tutorial on javascript closures on the whole internet.
    Period!

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

    Your tutorials are simply the best on RUclips, thanks for your effort you put for creation high quality content for free ! ❤

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

    Very clear 👌👌👏👏

  • @estherokiki5894
    @estherokiki5894 9 месяцев назад

    Thanks for all you do, Dave. Your videos are the best. I've watched several videos on closures, but none of them explained it better than you did. I finally understand closures!

  • @MB-hn5qk
    @MB-hn5qk 9 месяцев назад

    Probably the best Closures video I have ever watched. Thanks!!

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

    I wish I had stumbled across your video sooner! I've been trying to wrap my brain around closures for so long. Super helpful! You got a new subscriber!

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

    I really found this explanation about lexical scope and closure the best one from RUclips. Thank you.

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

    Thank you for your video! This is the most understandable explanation of closures I've seen and has solidified my understanding of the concept. Really appreciate the emphasis on what "lexical scope" is and how it's an integral part of -- but not the whole story with -- closures. Truly awesome! Thank you, good sir!

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

    The best and detailed "Closure" explanation on the internet

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

    Not bored at all. Nicely presented. :)

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

    Before coming across your video I had already watched three other ones that weren't explanatory enough for me. Thank you so much for this video; I got everything. Thank you.

  • @abdelbasset8280
    @abdelbasset8280 3 года назад +1

    Thanks Dave you could help me to understand the most confusing concept in js, after I read a lot of articles and watched a ton of tutorials.

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

    It’s so refreshing to listen,well explained.Thank you Dave

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

    The best teacher to explain advanced concepts of Javascript. Instant subscription!

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

    i watched too many closure videos but first time i understand clearly . thank you so much

  • @proactivex
    @proactivex 3 года назад

    I watched maybe 10 videos on closure. Finally one person can explain it well, Dave Gray! You also crushed on that song white ladder.

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  3 года назад

      Ha! I do share my name with a few others, but I'm glad I could help with closures! 💯🚀

  • @bluevojka
    @bluevojka 10 месяцев назад

    This was Amazing Dave!!

  • @oscargm1979
    @oscargm1979 4 месяца назад

    Perfectly perfectly and perfectly explained. Congrats

  • @wzup23
    @wzup23 7 месяцев назад

    Thanks dude, it's so clear. I will definitely rewatch this over and over again until I am very familiar with the concept.

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

    Just a quick thought.
    I think the "credits =- 1" line should be at the end of the function since we need to check credits' amount first to evaluate the possibility of playing. In the example we should be able to play 3 times and it only allows two plays.
    Everything aside, great video and I always find your explanations very helpful!

  • @joynal_dev
    @joynal_dev 3 года назад +1

    Your videos are absolute gems 💎. Keep up the good work.

  • @wallacepei4529
    @wallacepei4529 3 года назад +1

    Thank you for clarifying IIFE, it's syntax that has been tripping me up and now I understand what it's doing. Excellent demonstrations for closures.

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

    This is by far the best explanation of JS closure. Thank you Dave. I'm glad I came across your channel.

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

    Good explanation, thank you sir :)

  • @sugarfairy1248
    @sugarfairy1248 10 месяцев назад

    well chosen examples demonstring the unique characteristics of closure. Finally undertand it now!

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

    Clear, simple, concise, well spoken and very useful. I followed along with your code in my IDE (Velo) with no difficulty. Thank you.

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

    This is what closure is...I was just thinking lexical scope is closure. Superbly explained. Thanks alot.

  • @shivashankar6043
    @shivashankar6043 3 года назад +3

    Thanks Dave for this video, please continue the advanced js playlist. You explaining hard concepts easy to understand.

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

    thank you, Dave! as always, easy to understand, yet consise and to the point.

  • @kumarisuman4565
    @kumarisuman4565 3 года назад +1

    This was a great video. I was struggling with closures for some days but now I feel like i understand it now. THANKS Again it was a great video.

  • @pharmakidsarl8449
    @pharmakidsarl8449 7 месяцев назад

    One of the best video on closure

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

    Dave, thank you so much for this tutorial. I finally got my "Gotchaa!" moment about closures. I watched several explanations before but this really helped me to understand. Lifesaver :)

  • @NadaAlSharqawy
    @NadaAlSharqawy 5 месяцев назад

    This is the only explanation that made me understand it, thank you

  • @shadabs000
    @shadabs000 3 года назад

    Finally , finally I could wrap my head around this concept. It's so basic and easy.

  • @GrahamO-g5g
    @GrahamO-g5g 10 месяцев назад

    Best explaination on the web. Great job sir! Thank you!

  • @abhinavtiwari89
    @abhinavtiwari89 9 месяцев назад

    This is the best tutorial on Closures.
    Thank You!

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

    People misunderstand js a lot. People like u make it relevant for us js peeps. Keep going!

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

    wow...Great explanation...Thank you, Dave...

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

    this man, helps me to understand closure quickly and easily!

  • @imperativeemarketing5546
    @imperativeemarketing5546 3 года назад

    I "Thumbs Upped" your video. I've been studying JS recently for a few months, and to my surprise everything is getting easier to understand, like I'm on the steeper part of the learning curve. I've been getting a clearer picture of what closures are, but your explanation helped even more to demystify closures to me. You have a very sensible, logically explanatory and intelligent way of explaining closures. I'll be checking out your other videos because I like your teaching style. Who knows, maybe I'll buy you a cup of coffee :).

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

    12:45 The important highlight he mentions.
    IIFE code happens once. The anonymous function inside it only get's returned ONE time (to privateCounter). After that, you can look at privateCounter as:
    privateCounter = () => { count +=1; console.log(count) } //but with it's own access to private variable "count".
    -I'm guessing you can say it has enClosed it's scope over the function and it's declared variables. 5:45

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

    Best video about closure so far. You are a very good teacher.

  • @richardy.hayashi117
    @richardy.hayashi117 День назад

    Hi Dave, I just thought of a way to explain closures in terms of bubble universes. The returned function can be thought of as containing variables in its own bubble universe.

  • @alimohammad-lg8sw
    @alimohammad-lg8sw Год назад

    Thank you so muchhhh
    The best closure explanation ever

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

    Finally I understood JS closures!
    Subscribed!

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

    This video was an instant subscribe. It was well thought out and clear, and I now understand two concepts much better than ever before. Closure kind of blew my mind. Thank you so much for sharing your knowledge!

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

    I've been programming on JavaScript for over 2 years, I hope I'll feel ready to apply for a job soon, even being old to start, I'm 36. Until now, if I was asked about Closure I replied about lexical scope. The IIFE explanation was interesting although I knew it already, because I used them on my API. I do full stack with MERN. Anyway, great video, very clear explanation. 👏👏👏

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

      Thank you, Leonardo 🙏 You're never too old to do what you love - keep making progress! 💯

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

    Thank you for clear examples, I finally understood. I looked at other youtubers and it was confusing.

  • @gerar10s
    @gerar10s 3 года назад +3

    Great video! This explains a lot and you've got a new subscriber. It might be my lack of Javascript knowledge but I still don't quite understand why after the first time, every time the parent function is called, only the child function executes and not the WHOLE parent function. I'm going to watch it a few more times and see if it sinks in. Thanks for the video!

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  3 года назад +6

      Glad it was helpful! This explanation may help... The parent function is only called once. It returns the "child" function. The variable is therefore set to the child function that is returned. Afterwards, using the variable, only the child function is called. The closure allows the child function to still access the variable that was created within the parent. What we're really referring to here is the lexical scope of the function that is returned, but using the parent and child terminology could help! 😀🚀

    • @ARandomPerson--
      @ARandomPerson-- 3 года назад

      Wow that quick explanation really helped. Thx

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

    Dave, you need to seriously consider putting together a Javascript course with projects for Udemy. Your explanations are crystal clear. I have found myself doing course after course, stopping, and then trying to find someone else who would be able to explain the concept a bit clearer than the instructor. It wastes a lot of time. I have found myself coming here for the past three or so concepts, and they click straight away. So thank you.

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

      Thank you, Darryl! I do hope to put a premium course together sometime later this year. I am not sure if Udemy is where I will launch it though.

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

    Thanks, Dave! You are really good at explaining! 😊

  • @InnaKasyan-f8h
    @InnaKasyan-f8h 2 года назад

    Thank you ! The explanation is extremely clear for beginners.

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

    This is the best closure explanation for me... Great work.

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

    This was a masterclass on how to explain abstract concepts with easy-to-follow, real-world examples. Thank you. Subbed!

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

    Awesome explanation! Subscribed and digging other videos! Thanks man!

  • @mohamadybr
    @mohamadybr 3 года назад

    This tutorial is so well structured it simplified the closure concept in a brilliant way!! Thanks a lot

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

    Thank you for an excellent learning experience! By far the best explanation of what initially appears to be a difficult concept. Subscribing so that I can actually learn to understand things from an excellent teacher!

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

    Thank you Mr.Gray 🤍

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

    awesome explanation Dave!!!Thank you

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

      You're welcome!

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

      @@DaveGrayTeachesCode can you pls make a tutorial on Data structures 😃in javascript

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

    just found out about this series! Loving them

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

    finally found a video about closures that makes sense. Thanks

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

    Thanks. You re the best explanator :D

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

    Good job Dave, thank you so much.

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

    You made closure clear to me! Thank you so much!

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

    Excellent explanation of closure. Thank you!

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

    thank you very much for putting effort in making these tutorials !!!

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

    This is really great explanation! Thank-you Mr. Dave

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

    Hi DaveGray,
    I’m a student and have completed learning the MERN stack from your channel. I would love to see a course focused on building microservices with serverless architecture. It would be great if you could cover topics like designing, deploying, and scaling microservices using platforms such as AWS Lambda please.

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

    Thank you! Finally understood this important concept.

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

    You are the best one that explained it. Thank you a lot.