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

ความคิดเห็น • 715

  • @atatdotdot
    @atatdotdot 9 หลายเดือนก่อน +107

    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  9 หลายเดือนก่อน +31

      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 ปีที่แล้ว +413

    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

  • @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

  • @dom9534
    @dom9534 2 ปีที่แล้ว +17

    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 🙏

  • @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!

  • @hamzadlm6625
    @hamzadlm6625 ปีที่แล้ว +13

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

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

    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!

  • @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 🙏

  • @drakZes
    @drakZes ปีที่แล้ว +11

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

    • @RDT
      @RDT  ปีที่แล้ว

      Wow, thank you! 🙏

  • @sadhappy8860
    @sadhappy8860 7 หลายเดือนก่อน +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.

  • @nelsondasilva3935
    @nelsondasilva3935 ปีที่แล้ว

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

  • @kunikaingale4704
    @kunikaingale4704 ปีที่แล้ว

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

  • @somtoilo7465
    @somtoilo7465 9 หลายเดือนก่อน +3

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

    • @RDT
      @RDT  9 หลายเดือนก่อน

      Wow, thanks!

  • @ChaDaeyeob
    @ChaDaeyeob 9 หลายเดือนก่อน +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  9 หลายเดือนก่อน

      You're very welcome!

  • @venkateshak.s9290
    @venkateshak.s9290 ปีที่แล้ว +3

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

  • @wassimmouloud3432
    @wassimmouloud3432 ปีที่แล้ว

    the way you explain things is just perfect

  • @chrislione950
    @chrislione950 ปีที่แล้ว +1

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

  • @mushroomthump
    @mushroomthump ปีที่แล้ว +2

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

  • @huangtiantian8770
    @huangtiantian8770 ปีที่แล้ว

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

  • @eidercarlos6391
    @eidercarlos6391 ปีที่แล้ว

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

  • @joepage3065
    @joepage3065 ปีที่แล้ว +1

    Very clear and concise explanation. Thanks 👍

  • @AbhishekTiwari-xt1kt
    @AbhishekTiwari-xt1kt ปีที่แล้ว +4

    Wow, nicely explained, short and sweet No BS

  • @richk5015
    @richk5015 2 หลายเดือนก่อน +1

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

    • @RDT
      @RDT  2 หลายเดือนก่อน

      My pleasure!

  • @comrade_rahul_1
    @comrade_rahul_1 หลายเดือนก่อน +1

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

    • @RDT
      @RDT  หลายเดือนก่อน +1

      Awesome! Thank you!

  • @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!!!

  • @vegeta4614
    @vegeta4614 2 ปีที่แล้ว

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

  • @chrisstrauss7288
    @chrisstrauss7288 10 หลายเดือนก่อน

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

  • @omri20omri
    @omri20omri ปีที่แล้ว

    I never comment to TH-cam videos but I'm feeling ungrateful not to comment this one, that explanation was SMOOTH. Thank you so much!!!

    • @RDT
      @RDT  ปีที่แล้ว

      😎

  • @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!

  • @mikehillbilly4079
    @mikehillbilly4079 หลายเดือนก่อน +1

    Concise, precise and nice. Excellent!

    • @RDT
      @RDT  24 วันที่ผ่านมา

      Thanks

  • @InderjeetSingh-zm3sf
    @InderjeetSingh-zm3sf ปีที่แล้ว

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

  • @DipanjanPatra
    @DipanjanPatra ปีที่แล้ว

    Cleanest async/await explainer!

  • @MichaelKim505
    @MichaelKim505 3 หลายเดือนก่อน

    Truely helpful and insightful explanation on Promise with good examples.

  • @PerryCS2
    @PerryCS2 ปีที่แล้ว

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

  • @ajsim
    @ajsim ปีที่แล้ว

    Great explanation. Thank you very much!

  • @alexander5052
    @alexander5052 ปีที่แล้ว

    Awesome explanation! Thank you

  • @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 🙏

  • @mahdishirazi5785
    @mahdishirazi5785 ปีที่แล้ว

    this video is literally GOLD

  • @tanjimulislamsabbir857
    @tanjimulislamsabbir857 3 หลายเดือนก่อน

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

  • @samichosen524
    @samichosen524 ปีที่แล้ว

    Amazing presentation and great explanation, thanku

  • @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!

  • @danglad5546
    @danglad5546 ปีที่แล้ว

    Great simple explanation, you are very good at it.

  • @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!

  • @svalyavasvalyava9867
    @svalyavasvalyava9867 3 หลายเดือนก่อน

    Thank you infinitely for the clear explanation 😊

  • @josecarlosgarcia6477
    @josecarlosgarcia6477 ปีที่แล้ว

    this is the best explanation on TH-cam, Thanks

  • @neetujoshi6005
    @neetujoshi6005 ปีที่แล้ว

    Subscribed...short/simple easy to understand.

  • @idanhen10
    @idanhen10 ปีที่แล้ว

    Amazingly explained!

  • @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 🙂

  • @Aziz-kw6ct
    @Aziz-kw6ct 3 หลายเดือนก่อน +1

    Your explanation was perfect, thank you for the effort.

    • @RDT
      @RDT  3 หลายเดือนก่อน

      Glad it was helpful!

  • @roebienarnaiz
    @roebienarnaiz ปีที่แล้ว

    Concise! Great explanation.

  • @FailNTry
    @FailNTry 8 หลายเดือนก่อน

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

  • @Noraia
    @Noraia ปีที่แล้ว

    Best video about promises I watched so far!

  • @akulaganeshsantosh4584
    @akulaganeshsantosh4584 หลายเดือนก่อน +1

    crisp clear straight to the point no bullshit awesome tutorial

    • @RDT
      @RDT  หลายเดือนก่อน

      Thanks pal

  • @backtic_education
    @backtic_education ปีที่แล้ว

    Verrrrrrrrrrrrrry good explanation. Thank you so much.

  • @fr3dlopez
    @fr3dlopez ปีที่แล้ว

    Absolutely wonderful material!

    • @RDT
      @RDT  ปีที่แล้ว

      Thank you!

  • @tassneemaltaf2001
    @tassneemaltaf2001 ปีที่แล้ว

    Loved the explanation

  • @zhaofour9833
    @zhaofour9833 8 หลายเดือนก่อน

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

  • @nerdy561
    @nerdy561 ปีที่แล้ว

    Best explanation video out there!

  • @francodominguez238
    @francodominguez238 2 หลายเดือนก่อน

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

    • @RDT
      @RDT  2 หลายเดือนก่อน

      Thank you! 🤩

  • @Sammy-km9zk
    @Sammy-km9zk ปีที่แล้ว

    I love these kind of explainations

  • @Jeremiahking101
    @Jeremiahking101 ปีที่แล้ว

    This literally made my day! THANK YOU!

  • @normanluismadrid422
    @normanluismadrid422 ปีที่แล้ว

    beautifully explained, thanks for this

  • @jakub2631
    @jakub2631 ปีที่แล้ว

    Great explanation, thank you!

  • @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

  • @raziqijr
    @raziqijr ปีที่แล้ว

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

  • @ahmedshafraz1538
    @ahmedshafraz1538 2 วันที่ผ่านมา

    Awesome and simple explanation ❤

  • @zaeemjaved6850
    @zaeemjaved6850 ปีที่แล้ว

    BEST VIDEO ON THIS TOPIC! PERIOD!

  • @gravitasfolly8615
    @gravitasfolly8615 10 หลายเดือนก่อน

    Excellent tutorial. Made it so simple

  • @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!

  • @sekki2554
    @sekki2554 7 หลายเดือนก่อน

    Very well explained!

  • @awaraamin6850
    @awaraamin6850 ปีที่แล้ว

    Great job! it demystified the whole idea!

  • @KerishaStewart
    @KerishaStewart ปีที่แล้ว

    good refresher! thanks much!

  • @oguzhanaydn7482
    @oguzhanaydn7482 ปีที่แล้ว

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

  • @leonardmbibi8013
    @leonardmbibi8013 7 หลายเดือนก่อน

    Well summarized, thanks

  • @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

  • @d0m2288
    @d0m2288 2 หลายเดือนก่อน

    Great explanation, thank you.

  • @keyvanhosseini3518
    @keyvanhosseini3518 ปีที่แล้ว +1

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

  • @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 🙏

  • @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 🙂

  • @returnMarcco
    @returnMarcco 11 หลายเดือนก่อน

    Thanks for the video Rob

  • @kadidibwa968
    @kadidibwa968 ปีที่แล้ว

    Clean and precise explanation

  • @tamimabdullah3624
    @tamimabdullah3624 3 หลายเดือนก่อน

    the explanation was really helpful!

  • @thishandharmakeerthi5327
    @thishandharmakeerthi5327 ปีที่แล้ว

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

  • @Nneoh1
    @Nneoh1 ปีที่แล้ว

    Phenomenal explanation, thank you!

  • @tlilimourad5671
    @tlilimourad5671 ปีที่แล้ว

    Perfect explanation

  • @prasadkadu9737
    @prasadkadu9737 ปีที่แล้ว

    The editing is top class

  • @amityadav-np1rk
    @amityadav-np1rk ปีที่แล้ว

    Very well explained!! Thank you 🙏

  • @user-nd7sk2ph4f
    @user-nd7sk2ph4f ปีที่แล้ว

    Thanks a lot for this great tutorial🎉

  • @jalalkhan3166
    @jalalkhan3166 2 หลายเดือนก่อน +1

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

    • @RDT
      @RDT  2 หลายเดือนก่อน

      Thanks 🙏

  • @philipackerley5775
    @philipackerley5775 ปีที่แล้ว +3

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

    • @RDT
      @RDT  ปีที่แล้ว

      Wow, thank you 🙏😊

    • @returnMarcco
      @returnMarcco 11 หลายเดือนก่อน

      It's Rob

  • @allhailalona
    @allhailalona 3 หลายเดือนก่อน +1

    I really liked this video:
    A. I like Harry Potter, and your accent reminds me of stephen fry reading the book
    B. the explanation is actually short and concise, and the editing is quite nice too, something u don't see a lot around...

    • @RDT
      @RDT  3 หลายเดือนก่อน +1

      Thank you! 🙏 I’ve not been compared to Stephen Fry before, an honour 😎

  • @baderelhayah7961
    @baderelhayah7961 ปีที่แล้ว

    Thanks for the video, this is very helpful

  • @ThanhLe-dh1ir
    @ThanhLe-dh1ir ปีที่แล้ว

    the perfect explanation bro

  • @SonnyTechAcademy
    @SonnyTechAcademy ปีที่แล้ว

    Great video man!

  • @mohitgoyal9931
    @mohitgoyal9931 2 หลายเดือนก่อน

    Great explanation 😊

  • @jonathansilva4883
    @jonathansilva4883 11 หลายเดือนก่อน +1

    Great explanation, thanks!

    • @RDT
      @RDT  11 หลายเดือนก่อน

      Glad it was helpful!

  • @djrmarketing598
    @djrmarketing598 หลายเดือนก่อน +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  หลายเดือนก่อน

      Thanks

  • @supernova82
    @supernova82 2 ปีที่แล้ว +1

    This is great. Well done!

  • @vampirekabir
    @vampirekabir 2 ปีที่แล้ว +1

    well edited and well explained!!u deserve million subs

    • @RDT
      @RDT  2 ปีที่แล้ว

      Thanks! We agree 😅