Javascript Promises vs Async Await EXPLAINED (in 5 minutes)

Поділитися
Вставка
  • Опубліковано 17 сер 2021
  • In this tutorial I explain what Javascript promises are, why we need them, and how to use them, catch errors properly and then convert the same code to use async and await. With examples!
    ☕️ Don't forget, old developers need coffee (and.. beer and pizza too 🍺 🍕)
    www.buymeacoffee.com/Robertsd...
    Check out the Bored API for fun sample data:
    www.boredapi.com/
    📧 📫 Join us on our developer journey! Sign up to our email newsletter:
    robertsdevtalk.com
    🐦 Follow us on Twitter:
    / robertsdevtalk
    🎶 Music by Epidemic Sound:
    www.epidemicsound.com/referra...
    Our gear - click through to support our channel! :)
    Camera (Canon M50)
    🇬🇧 UK: amzn.to/3sUbzuL
    🇺🇸 US: amzn.to/3uBsG5c
    Camera mic (RODE VideoMic Pro)
    🇬🇧 UK: amzn.to/3ml8xgC
    🇺🇸 US: amzn.to/2RkGxyi
    Camera tripod (Manfrotto Compact tripod):
    🇬🇧 UK: amzn.to/3fJGyWU
    🇺🇸 US: amzn.to/3mF4oV2
    Voiceover Mic (Blue Yeti)
    🇬🇧 UK: amzn.to/2PV7UOQ
    🇺🇸 US: amzn.to/3uMiEym
    Chris's dev mouse for PC (Logitech MX Master 3)
    🇬🇧 UK: amzn.to/39K7BNV
    🇺🇸 US: amzn.to/3uKYvso
    Chris's dev keyboard for PC (Logitech MX Keys)
    🇬🇧 UK: amzn.to/3rSbHcX
    🇺🇸 US: amzn.to/3a6Unef
    Rob's dev keyboard for Mac (Apple Magic Keyboard)
    🇬🇧 UK: amzn.to/3dEQpKG
    🇺🇸 US: amzn.to/3sb6JZc
    Rob's dev mouse for Mac (Apple Magic Mouse)
    🇬🇧 UK: amzn.to/3sRCQhr
    🇺🇸 US: amzn.to/3mFi6qS
    Icons in this video kindly provided by FlatIcon from Freepik
    www.freepik.com
    www.flaticon.com
    JS icon provided by Icon8 icons8.com
    Disclaimer - some of our links are affiliate links, which means that we receive a small commission for any sales made via those links, at no extra cost to you - so a great way to support our channel! Thank you so much for your support 😊
    #javascript #promises #async

КОМЕНТАРІ • 719

  • @atatdotdot
    @atatdotdot 10 місяців тому +110

    2:25 "Then is called when the task completes... the catch method is called if anything goes wrong". This is wrong. These methods are called immediately. It's the functions that you pass to them that are called on those conditions. This may sound like pedantry but I would strongly suggest anyone trying to learn this to fully understand the distinction here.

    • @RDT
      @RDT  10 місяців тому +32

      Good catch, thanks. Pinning this comment.

    • @paulhetherington3854
      @paulhetherington3854 8 місяців тому

      Only if - there be - () call f(x) - pre amp d(x)! It never did - ught yet?

    • @jellyjollyjelly9513
      @jellyjollyjelly9513 5 місяців тому +3

      "It's the functions that you pass to them that are called on those conditions. " what do you mean by "on those conditions"? do you mean the functions passed to then() and catch() are called after the task completes? im confused about this sentence

    • @mattpickel223
      @mattpickel223 4 місяці тому +3

      @@jellyjollyjelly9513 I think he is saying the method 'then' is called immediately when that line is executed. It is a method of a Promise. It binds a callback function that will be called when the promise returns fulfilled.
      'The 'then' method is called when the task completes' would be wrong and should be
      'The callback function passed to the 'then' method will be called when the task completes'

    • @sergioadame5528
      @sergioadame5528 4 місяці тому

      the .then anc .catch methdos being called inmediatly ever affects something? why giving the distinction between the execition of the methods en the code inside it if nothing will happen until the promise es fullfield? i guess there is something but cant thing of a case

  • @dub161
    @dub161 2 роки тому +416

    this is what I call a perfect 10/10 explanation. "Crisp" and at the same time complete information with example.

    • @RDT
      @RDT  2 роки тому +12

      Thanks for your kind words and support of the channel Nakshatra

    • @lecomar7220
      @lecomar7220 Рік тому +1

      @@RDT The tutorial was beyond. It was quick BUT delivered ALL the information I was looking for. Thank you so much Roberts Dev Talk, wow!!!!!!!!😮😃😍

    • @omdodmani3205
      @omdodmani3205 3 місяці тому +1

      Yeah! Example Makes it way easier to understand compared to just explaining the theory.

  • @SoraJustAGuy
    @SoraJustAGuy Рік тому +243

    It’s important to point out that working with multiple apis you often have to chain multiple promises resulting in callbacks nested inside callbacks nested inside callbacks nested inside callbacks…you get the idea. 😅This is what we call a CALLBACK HELL. So the primary reason async/ await exists is to avoid a callback hell

    • @RDT
      @RDT  Рік тому +13

      Absolutely 👍🏻

    • @babykosh5415
      @babykosh5415 Рік тому +6

      This is what I was looking for...thank you for asking this!

    • @Ketan2555
      @Ketan2555 Рік тому +1

      @@kkdpsudpsu Promise.all is not suitable when you need to ensure the first API call's response is available before making another API call that relies on it.

    • @mohamedafrid1349
      @mohamedafrid1349 Рік тому +1

      I just want to call another api using first call's result. What method I have to follow ?

    • @mohamedafrid1349
      @mohamedafrid1349 Рік тому

      By the way, i am using subscription for the first call

  • @dom9534
    @dom9534 2 роки тому +18

    dude this just made so many lightbulbs go off in my head and tied so many things together for me. thank you

    • @RDT
      @RDT  2 роки тому

      Thanks! Glad to hear it helped - I hoped it would do 🙏

  • @nelsondasilva3935
    @nelsondasilva3935 Рік тому

    perfect: short and sweet.. no fluff or dragged on and on examples.. 10/10

  • @onepointproduction9092
    @onepointproduction9092 Рік тому

    Good lord, it's the most clear explanation i've ever watch. Thanks bro

  • @kunikaingale4704
    @kunikaingale4704 Рік тому

    bruh why so underrated?! Such a marvellous explanation, straight to the point

  • @joelmounts3336
    @joelmounts3336 2 роки тому +70

    hugely underrated. so few channels are 1. this well edited AND 2. this well explained

    • @RDT
      @RDT  2 роки тому +1

      Thank you that means a lot to hear 🙏

    • @vladpanchuk4699
      @vladpanchuk4699 Рік тому

      agree

  • @hamzadlm6625
    @hamzadlm6625 Рік тому +14

    The first person I watch to not explain 1 phrase using 20 phrases, neat and straight to the point! thank you.

  • @ChaDaeyeob
    @ChaDaeyeob 10 місяців тому +1

    After struggling with various definitions of async/await, I stumbled upon this video which made everything crystal clear. Thank you so much Mr. Sir Roberts for simplifying things!

    • @RDT
      @RDT  10 місяців тому

      You're very welcome!

  • @miladevs
    @miladevs 15 днів тому

    Great analogy with the waiter bringing coffee to explain promises! It really clarifies how promises work in JavaScript. Using then and catch makes handling asynchronous operations much cleaner. Thanks for breaking it down so well, Kyle!

  • @mushroomthump
    @mushroomthump Рік тому +2

    I was so confused about this, cleared it up for me, thanks!

  • @chrislione950
    @chrislione950 Рік тому +1

    Wow,this is hands down the best explanation of this topic. Thanks alot

  • @sadhappy8860
    @sadhappy8860 8 місяців тому +1

    I find that alot of 'programming words' are quite strange. It may sound complicated but it just needs someone to use the right explanation and then it clicks. A very helpful video, much appreciated.

  • @venkateshak.s9290
    @venkateshak.s9290 Рік тому +3

    Very neat n crisp information without any extra buzz! 🤗👏

  • @wassimmouloud3432
    @wassimmouloud3432 Рік тому

    the way you explain things is just perfect

  • @huangtiantian8770
    @huangtiantian8770 Рік тому

    Thanks! This is the best video explaining await and promises I have ever seen

  • @bennythetiger6052
    @bennythetiger6052 Рік тому +4

    Oh my God!!! This explanation is perfect! I was really struggling to understand both promises and async functions, but now I see it all! Thank you so much!

  • @mattmcrae
    @mattmcrae 6 місяців тому +8

    Umm... This is by far the most simple and logical explanation of this topic I've seen. In five minutes I've gone from writing code I didn't understand to totally getting it. Thank you!

    • @RDT
      @RDT  6 місяців тому

      Excellent!

  • @JasperEjoc
    @JasperEjoc Рік тому

    of all the videos I watched, this is by far the most simple explanation of promises then, catch vs async await, thank you for this video

    • @RDT
      @RDT  Рік тому +1

      You're very welcome!

  • @mehmetbulut1553
    @mehmetbulut1553 Рік тому +1

    After months of struggle finally understanding Promises thank you so much Robert. Definitely subscribed 🥰

    • @RDT
      @RDT  Рік тому +1

      Thanks for the sub Mehmet! Glad the video helped you 🙏

  • @vegeta4614
    @vegeta4614 2 роки тому

    This is really helpful. Will go through all ur javascript turorials now

  • @PerryCS2
    @PerryCS2 Рік тому

    I really like how you add the code to the video AS you explain it... helps break things down...

  • @GovindYaswanth
    @GovindYaswanth 10 місяців тому

    Had listened to lot of videos and read articles. But Wow!!! Yours is best explained and perfect real time example... Love it Man!!!

  • @AbhishekTiwari-xt1kt
    @AbhishekTiwari-xt1kt Рік тому +4

    Wow, nicely explained, short and sweet No BS

  • @jacintdavid5333
    @jacintdavid5333 2 роки тому +8

    Watched async videos of bigger channels first and I have to say yours was superb!

    • @RDT
      @RDT  2 роки тому

      Thanks, that means a lot to hear 🙏

  • @chrisstrauss7288
    @chrisstrauss7288 10 місяців тому

    Best explanation iv seen on this to date. Cleared up a lot for me

  • @eidercarlos6391
    @eidercarlos6391 Рік тому

    Great! The best explanation about the topic I've seen! Thanks!

  • @richk5015
    @richk5015 2 місяці тому +1

    Thank you, Chris, for explaining everything so eloquently. 🙏

    • @RDT
      @RDT  2 місяці тому

      My pleasure!

  • @kashix.
    @kashix. Рік тому

    This is the best explanation with the best examples I've ever seen about async in Javascript. Thank you very much!!

    • @RDT
      @RDT  Рік тому

      You're very welcome!

  • @Reaper_f30
    @Reaper_f30 Рік тому

    coffee example is one of the best clearest ones ive seen man :D

    • @RDT
      @RDT  Рік тому

      Thanks glad you liked it mate 🙂

  • @zhaofour9833
    @zhaofour9833 8 місяців тому

    The best explanation so far only uses 5 min and easy but illustrative example

  • @MichaelKim505
    @MichaelKim505 3 місяці тому

    Truely helpful and insightful explanation on Promise with good examples.

  • @VOGTLANDOUTDOORS
    @VOGTLANDOUTDOORS Рік тому

    A VERY CLEAR handling of this often-confusing topic. You just EARNED another subscriber !
    -Mark in North Aurora IL (USA)

    • @RDT
      @RDT  Рік тому

      Thanks for your support Mark 🙂

  • @bartomiejsadecki8309
    @bartomiejsadecki8309 2 роки тому +3

    Briliant video, very simple and easy to understand, it's nice that you're comparing the two in one short video. Thank you!

    • @RDT
      @RDT  2 роки тому +1

      Thanks for your kind comments and support

  • @francodominguez238
    @francodominguez238 2 місяці тому

    This is the most beautiful explanation I've ever heard, thank you

    • @RDT
      @RDT  2 місяці тому

      Thank you! 🤩

  • @user-jb3dz6pp1o
    @user-jb3dz6pp1o 4 місяці тому +1

    This explanation was amazing. It was not complicated at all. Thank you.

    • @RDT
      @RDT  4 місяці тому

      You're very welcome!

  • @josecarlosgarcia6477
    @josecarlosgarcia6477 Рік тому

    this is the best explanation on UA-cam, Thanks

  • @wtf_jokes9639
    @wtf_jokes9639 11 місяців тому +4

    What an absolute break down. I wish all teachers had the touch to teach like you

    • @XX-vu5jo
      @XX-vu5jo 7 місяців тому

      LOL he taught it the wrong way LOL!!!!!!!!!! you are clearly learning from wrong content, poor guy

  • @joepage3065
    @joepage3065 Рік тому +1

    Very clear and concise explanation. Thanks 👍

  • @FailNTry
    @FailNTry 8 місяців тому

    One of the best video i watched in 5 mins well done ❤

  • @somtoilo7465
    @somtoilo7465 9 місяців тому +3

    This is perfect! Wow best explanation I've come across

    • @RDT
      @RDT  9 місяців тому

      Wow, thanks!

  • @YaBoiDallin
    @YaBoiDallin Рік тому +2

    I've been trying to figure out promises and async for days and it finally makes sense. Thanks!

  • @Noraia
    @Noraia Рік тому

    Best video about promises I watched so far!

  • @comrade_rahul_1
    @comrade_rahul_1 2 місяці тому +1

    This was the first I understood async, await! Amazing video. 🤗

    • @RDT
      @RDT  2 місяці тому +1

      Awesome! Thank you!

  • @elisamunozespineira6809
    @elisamunozespineira6809 Рік тому

    super well explained, I have watched tons of videos and I finally feel like I understand it!

    • @RDT
      @RDT  Рік тому

      Thanks Elisa, glad it was helpful to you 🙏

  • @InderjeetSingh-zm3sf
    @InderjeetSingh-zm3sf Рік тому

    Loved the explanation....it helped alot thanks!!!!

  • @jenkov2155
    @jenkov2155 6 місяців тому

    Been a bit confused about the promises, async await, and try catch thing. But not anymore. Best explanation :D

  • @tanjimulislamsabbir857
    @tanjimulislamsabbir857 4 місяці тому

    This is very clear and organised video. I loved it.❤

  • @raziqijr
    @raziqijr Рік тому

    this was one of the best explanation of async and promises !

  • @danglad5546
    @danglad5546 Рік тому

    Great simple explanation, you are very good at it.

  • @Aziz-kw6ct
    @Aziz-kw6ct 3 місяці тому +1

    Your explanation was perfect, thank you for the effort.

    • @RDT
      @RDT  3 місяці тому

      Glad it was helpful!

  • @Jeremiahking101
    @Jeremiahking101 Рік тому

    This literally made my day! THANK YOU!

  • @ajsim
    @ajsim Рік тому

    Great explanation. Thank you very much!

  • @DipanjanPatra
    @DipanjanPatra Рік тому

    Cleanest async/await explainer!

  • @alexander5052
    @alexander5052 Рік тому

    Awesome explanation! Thank you

  • @philipackerley5775
    @philipackerley5775 Рік тому +3

    Superbly put together Chris, never heard or seen it explained as well
    😇

  • @svalyavasvalyava9867
    @svalyavasvalyava9867 4 місяці тому

    Thank you infinitely for the clear explanation 😊

  • @mohammedel2035
    @mohammedel2035 Рік тому +2

    Well, I can't find words to thank you enough... You helped me understand promises in 5min! Thank you so much!

  • @thishandharmakeerthi5327
    @thishandharmakeerthi5327 Рік тому

    Hands down, Quality content 10/10. I subscribed the channel.

  • @backtic_education
    @backtic_education Рік тому

    Verrrrrrrrrrrrrry good explanation. Thank you so much.

  • @jalalkhan3166
    @jalalkhan3166 2 місяці тому +1

    Promises & async await ARE PROUD OF YOU. such explanation💛

    • @RDT
      @RDT  2 місяці тому

      Thanks 🙏

  • @samichosen524
    @samichosen524 Рік тому

    Amazing presentation and great explanation, thanku

  • @keyvanhosseini3518
    @keyvanhosseini3518 Рік тому +1

    This video was so useful, thank you for creating it. 🙂🙂

  • @mahdishirazi5785
    @mahdishirazi5785 Рік тому

    this video is literally GOLD

  • @hughe1504
    @hughe1504 2 роки тому +3

    this is definitely the best tutorial i have came across. Well done

  • @idanhen10
    @idanhen10 Рік тому

    Amazingly explained!

  • @KerishaStewart
    @KerishaStewart Рік тому

    good refresher! thanks much!

  • @vampirekabir
    @vampirekabir 2 роки тому +1

    well edited and well explained!!u deserve million subs

    • @RDT
      @RDT  2 роки тому

      Thanks! We agree 😅

  • @akulaganeshsantosh4584
    @akulaganeshsantosh4584 2 місяці тому +1

    crisp clear straight to the point no bullshit awesome tutorial

    • @RDT
      @RDT  2 місяці тому

      Thanks pal

  • @someguynamedvictor
    @someguynamedvictor 10 місяців тому +1

    Beat explanation of these two concepts I’ve ever heard. 👍

    • @RDT
      @RDT  9 місяців тому

      That’s really kind, thank you

  • @gravitasfolly8615
    @gravitasfolly8615 10 місяців тому

    Excellent tutorial. Made it so simple

  • @oguzhanaydn7482
    @oguzhanaydn7482 Рік тому

    very good and instructive video, i get it better now thank you

  • @Sammy-km9zk
    @Sammy-km9zk Рік тому

    I love these kind of explainations

  • @ahmedshafraz1538
    @ahmedshafraz1538 10 днів тому

    Awesome and simple explanation ❤

  • @neetujoshi6005
    @neetujoshi6005 Рік тому

    Subscribed...short/simple easy to understand.

  • @nerdy561
    @nerdy561 Рік тому

    Best explanation video out there!

  • @zaeemjaved6850
    @zaeemjaved6850 Рік тому

    BEST VIDEO ON THIS TOPIC! PERIOD!

  • @normanluismadrid422
    @normanluismadrid422 Рік тому

    beautifully explained, thanks for this

  • @tassneemaltaf2001
    @tassneemaltaf2001 Рік тому

    Loved the explanation

  • @mikehillbilly4079
    @mikehillbilly4079 2 місяці тому +1

    Concise, precise and nice. Excellent!

    • @RDT
      @RDT  Місяць тому

      Thanks

  • @sanampakuwal
    @sanampakuwal 2 роки тому +1

    Really smooth, subscribed!

    • @RDT
      @RDT  2 роки тому

      Thanks Sanam

  • @leonardmbibi8013
    @leonardmbibi8013 8 місяців тому

    Well summarized, thanks

  • @loydcose2780
    @loydcose2780 2 роки тому +2

    That was short and simple, thank you!

    • @RDT
      @RDT  2 роки тому

      Thanks for your support Loyd

  • @supernova82
    @supernova82 2 роки тому +1

    This is great. Well done!

  • @tungpho2132
    @tungpho2132 10 місяців тому

    Jesus, your explanation literally make me happy and smiling reading the code, 10/10

    • @RDT
      @RDT  10 місяців тому

      Thanks! 🙏

  • @returnMarcco
    @returnMarcco Рік тому

    Thanks for the video Rob

  • @AOG91
    @AOG91 Рік тому +1

    Best short explanation I’ve ever seen!

    • @RDT
      @RDT  Рік тому +1

      Thanks for your kind comment and support Alvaro

    • @AOG91
      @AOG91 Рік тому

      @@RDT Ofc, you deserve it 🙂

  • @d0m2288
    @d0m2288 3 місяці тому

    Great explanation, thank you.

  • @songjoowan
    @songjoowan Рік тому +1

    Great video! Clear explanation, straight to the point in 5 minutes.

  • @sekki2554
    @sekki2554 7 місяців тому

    Very well explained!

  • @Nneoh1
    @Nneoh1 Рік тому

    Phenomenal explanation, thank you!

  • @tamimabdullah3624
    @tamimabdullah3624 4 місяці тому

    the explanation was really helpful!

  • @TriNguyenuc-jc3fp
    @TriNguyenuc-jc3fp 4 місяці тому +1

    Phenomenal explanation! You make my day sir

    • @RDT
      @RDT  4 місяці тому

      Glad you liked it! Thanks

  • @user-nd7sk2ph4f
    @user-nd7sk2ph4f Рік тому

    Thanks a lot for this great tutorial🎉

  • @PrestonL1
    @PrestonL1 Рік тому +7

    The most succinct explanation on this topic I've heard. Thank you!

    • @RDT
      @RDT  Рік тому +1

      Thanks for you kind comments and support of the channel

  • @anshvashisht8519
    @anshvashisht8519 Рік тому

    great explanation i have been struggling on google but you made it so easy.

    • @RDT
      @RDT  Рік тому

      Glad it helped you Ansh, I tried to make the video I was looking for when I was trying to understand it!

  • @baderelhayah7961
    @baderelhayah7961 Рік тому

    Thanks for the video, this is very helpful

  • @djrmarketing598
    @djrmarketing598 2 місяці тому +1

    This was a great explanation. Despite programming for 25+ years, I've used Promises a ton in JS and C# I've used promises there too and never really understood that await/async was basically the same thing just sequential. 5 stars on your explanation!

    • @RDT
      @RDT  2 місяці тому

      Thanks

  • @drakZes
    @drakZes Рік тому +11

    Best Promise explanation I have ever seen in my life!!!

    • @RDT
      @RDT  Рік тому

      Wow, thank you! 🙏