JavaScript Promises -- Tutorial for Beginners

Поділитися
Вставка
  • Опубліковано 27 чер 2024
  • JavaScript Promises and all their glory! This is episode 12 in a 10 part series I’m calling 10 things Javascript Developers Should Know But Probably Don't.
    JavaScript Promises
    Different phases of a Promise
    Chaining Promises
    Handling errors using Promises
    Benefits over callbacks and callback hell
    What do they all mean and why do you need them?
    Full playlist here: • 20 Things JavaScript D...
    JavaScript Promises from the series "10 Things JS Developers Should Know"
    by ColorCode.io, Sina Jazayeri
    ** Announcement **
    Full JavaScript Mastery course is coming! Details at the end of the video. Sign up for Early Access here:
    www.colorcode.io/js-mastery
    0:00:00 Intro
    0:01:48 Async vs. Sync
    0:03:29 The problem with Async
    0:07:00 Convert to Callback
    0:08:00 Convert to Promises
    0:10:32 Different phases of a Promise
    0:11:47 How to use a Promise
    0:14:47 Why do we like Promises?
    0:16:30 Chaining
    0:20:59 Benefits of Promises over Callbacks
    0:22:50 Error handling, REJECT and .catch()
    0:30:23 .finally()
    0:31:50 Real world example with fetch()
    0:34:30 Summary
    0:35:13 Next...

КОМЕНТАРІ • 441

  • @ColorCodeio
    @ColorCodeio  Рік тому +45

    🎉👨🏻‍💻 JavaScript Promises and all their glory! This is episode 12 of a 10 part series I’m calling 10 things Javascript Developers Should Know But Probably Don't. Enjoy!

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

      Amazing series :)

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

      12 out of 10?
      thats a out of bounds/stack overflow

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

      You promise 10 episodes but now in 12 😂😂

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

      Promises

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

      Which js compiler are you using?

  • @Saliha_Abid
    @Saliha_Abid Рік тому +15

    I am a 15 year old learning front-end development and struggling with promises. After 3 days of exhaustion I found ur video and finally got the whole concept. Thank you for this masterpiece 😍😍

  • @amanueletana
    @amanueletana Рік тому +24

    This is not only coding tutorial rather its an ART!

  • @user-gi3oc1kv5m
    @user-gi3oc1kv5m Рік тому +75

    I’ve been watching videos for years trying to make sense of Promises, and while I got through it, I’ve always wanted to come back and really understand them. Your video turned the light bulb on for me. Wow! I had to tip you for the help!
    I appreciate it so much! Definitely subscribing!

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

      That’s so great to hear. Thanks for sharing.

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

      @@doublewhopper67 ure da g

  • @AJD...
    @AJD... Рік тому +52

    Been watching your shorts for a while, decided to hop into your channel and this is the first video I watched. Holy hell the quality of your videos is mind blowing. You put so much effort into edits and your explanation is very planned, with a set preordained path which makes the most sense.
    You've got a new sub.

  • @lemonbubble1243
    @lemonbubble1243 7 місяців тому +16

    3 days ago I wanted to watch just this video but the title made me look for the whole series, and I knew that to understand better I needed to watch the previous episodes, and OMG I'M GLAD I DID. I feel I have like a super knowledge now, EVERYTHING MAKES SENSE NOW!! I don't know how to express how grateful I am!! I'm so excited because you cleared all my doubts about promises and not just promises, now I understand Objects() way better! THANKS!! Waiting for your master class!!

    • @ColorCodeio
      @ColorCodeio  7 місяців тому +2

      Glad to hear it! Full course coming soon.

    • @RaviCreative3-ge4ne
      @RaviCreative3-ge4ne 6 місяців тому

      eagerly waiting man @@ColorCodeio

  • @AriKhuu
    @AriKhuu Рік тому +9

    I'm so happy to be finding your channel I want to cry. Impeccable production. Clear examples. Perfect pacing - not too fast, not too sluggish. Detailed yet very follow-able explanation. Funny host. thank you thank you thank you.

  • @user-eq9gs7bl2e
    @user-eq9gs7bl2e Рік тому +19

    i can tell you put a lot of passion and effort into your work bro its inspiring

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

    There aren't many video's that are 30+ minutes worth rewatching, but this one certainly is. Nice video

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

    Thank you so much for making an actually apprehensive video that normal people can understand, explaining the why's and how's in a much better detail than a lot of other videos I've watched! Subscribed and added this to my favorites in case I should I need it in the future! 👍

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

    I really like how your examples lead to real life situations and at the end it doesn't seem that complicated. Thanks!

  • @HarshitGautam-bj3lc
    @HarshitGautam-bj3lc 9 днів тому

    Believe Me you are the best on the UA-cam, I have watched tons of videos on Promises but finally i gain much more insight now, thanks a lot one more things please increase the number of videos and no. of frequency you make and upload those videos that would be much more appreciated.
    Again Thanks a lot.
    KEEP POSTING DAILY (if possible).

  • @stephenkettley
    @stephenkettley 5 місяців тому

    Man your content is so insightful and relaxed at the same time! Loving it.

  • @vighneshs416
    @vighneshs416 7 місяців тому +3

    I stumbled upon your channel from a random UA-cam shorts. I am very certain that soon you are going to be a lot of people's go-to channel for Javascript (Or anything that you make content on). The effort you put in to make the concepts intuitive is just top-notch. And I guess it is very evident from the other comments as well. Thanks for the effort you are putting in man

    • @blaqhakym
      @blaqhakym 7 місяців тому +1

      Exactly the same for me. Looks like I will be here for a while. I'm hitting sub right away

    • @ColorCodeio
      @ColorCodeio  7 місяців тому +2

      Thank you both! Welcome aboard.

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

    This is the first time I'm seeing this guy, 30 seconds into the video, and I had to subscribe. Thanks for the video and the fun!

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

    I just came across your channel. You have a really great way of explaining things and giving them some context. Thumbs up 👍and I'm looking forward to hopefully many more videos like this!

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

    Great work Sina, this is a subject that a lot of people seem to get wrong on interviews. Now I can refer them to this video. 👍🏽

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

      Thank you Ronald for your support, always!

  • @chaoticthundergod3368
    @chaoticthundergod3368 9 місяців тому +1

    Thank you for this video. Leaned a lot. I was learning about promises a year ago, didn't understand much so skimmed through it. But now i can explain to others what a promise is.

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

    I have watched the best vidoes of Kyle Simpson, Tyler McGinnis, Tony Alicea, colt Steele, Jim cooper, Aksay, Ania, Maximilian, Sasha, I can go on and on.... I spent A LOT of Money just to understand. I have watched ALL YOUR VIDEOS.
    I can assure you that this explanation got.YOUR EXPLANATION of SIMPLIFYING THE CODE before refactoring in simply the Best.
    Your tutorial is AMONGST THE BEST THREE for me. THANK YOU, THANK YOU, THANK YOU.

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

      Thank you so much. This is very encouraging to hear.

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

    Learn alot from ColorCode in just one month.
    Such an amazing content.
    The way you explain things is very very very interesting and funny.
    *Best JS channel* on UA-cam.
    Thanks for such a premium content.
    Please deliver more.

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

    A very underrated channel. I like your style of teaching! Thank you for the content! Keep up the good work!

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

    What a charismatic person you are. Good Lord.
    I started the video knowing nothing about Promises and I am finishing it as an absolute pro.
    Thank you for going into detail.

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

    This will be the one video that gets me understand the basics concepts of promises. very good video outline and content.

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

    Thank you so much for this video! Finally someone who can explain promises well.

  • @chetanchaudhary1017
    @chetanchaudhary1017 29 днів тому

    Best video on Promise I have ever watched.

  • @proudmoroccan8164
    @proudmoroccan8164 5 місяців тому +1

    Thank you for sharing. Immensely appreciated. The best JavaScript promise tutorial as far as I am concerned. Best wishes for the new year.

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

    Top quality as always

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

    UUFFFFF The Chaining explanation was 🔥🔥🔥

  • @user-hs6jw1wm7i
    @user-hs6jw1wm7i Рік тому +1

    Lot's of gratitude from me here Js Master, this series is really impacting me...

  • @krypton_dev
    @krypton_dev 5 місяців тому

    another GREAT video. Thanks a lot SINA

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

    Thank you for putting out such high quality videos!

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

    you're the best of 7 videos about promises I've seen

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

    That was really helpful, I'm finally got the basics of it. THANK YOU!

  • @jasonblewis
    @jasonblewis Місяць тому +1

    Excellent tutorial, thank you

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

    I have seen lots of videos and tutorials but never use this topic of promises in my coding because of the bad and hard explanation, but now I am pretty sure I can use and refer to this great explanation ever, thanks a lot

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

    THE BEST JS CHANNEL

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

    5 minutes into the video and I can already tell that you are criminally underrated. Subbed

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

    You are a wonderful teacher. Thank you for creating these videos🙏

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

    That was pretty well explained, and FUN to watch ! Thank you, Weather Man!

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

    I loved everything in this video man, keep it up !

  • @rishayshandilya1817
    @rishayshandilya1817 11 місяців тому +1

    the best explanation of promises I promise :)

  • @CW-pd5fq
    @CW-pd5fq 16 днів тому +1

    Your teaching style is amazing, please continue your work 🙂

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

    yeeeee i was waiting for this video

  • @user-kn4oi9oh4i
    @user-kn4oi9oh4i 3 місяці тому +1

    Thank you so much for this!! ❤❤❤❤

  • @2difficult2do
    @2difficult2do Рік тому

    Thus is the best explanation of Promise! Thank you so much!

  • @theshtig4218
    @theshtig4218 11 місяців тому +1

    GOATED video. This will be the last promise video I ever watch. Thank you!

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

    24:28 u so right about repeating and coding from scratch again and again, this so important to memorize and practice some hands on
    great tutorial, thanks

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

    Thank you bro, can't wait for Episode 13 Async/Await

  • @jeffersonr.l2864
    @jeffersonr.l2864 Рік тому +1

    This content is simply amazing! Thanks for your effort in creating quality content, I learn a lot thanks to it.

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

    always great, you never disappoint!

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

    You are just awesome, keep up your work... Learnt a lot!! Thanks for this... I love JavaScript!!

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

    Bro your explanation of concepts is top notch. Keep the good work up!!

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

    Thank you. Looking forward to your video on async awaits!

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

    nice setup, nice host, nice code, nice music, nice edit, nice english

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

    This is by far the best explanation on the topic I have been able to find, and I must say I love your other videos as well. Love the production quality too, what is the recording software you're using, looks really slick?

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

      The animations are all done by hand. The screen recording is just basic QuickTime.

  • @not.sardar
    @not.sardar 22 дні тому +1

    Thank you sir, very helpful!

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

    Best Javascript tutorials on YT!

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

    Like the way that you teach, wonderful!

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

    i'm gonna comment fort the third time, that is the best video about Promise all over this app
    I spend 2 days on it, messing around with my own things
    Thanks a lot Color Code

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

      That’s awesome. Glad to hear it.

  • @breemudi
    @breemudi 11 місяців тому +1

    My first time ever watching you, and I'm intrigued by your tutoring style.
    Instant subscriber... Thank you

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

    Phenomenal. Beyond phenomenal.

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

    This is so well made. Thank you.

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

    Thanks for the clear explanation sir

  • @mrayaan8377
    @mrayaan8377 Місяць тому +1

    You nailed it man.. best explanation on whole youtube. i was frustrated. but now i know the whole concept of promises. SUBSCRIBED🌞❤

  • @16NaruSasuke
    @16NaruSasuke Рік тому +1

    Thank you very much. Your videos are awesome, it is very clear what you are saying.

  • @sh9vch9nk0
    @sh9vch9nk0 5 місяців тому

    Great video, clear and detailed!) Thank you a lot 😊🙏

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

    You rock!! 👑Thanks so much for your work!

  • @nikolanovakovic4150
    @nikolanovakovic4150 7 місяців тому +2

    Brooooooooooooo 🎆🎇❤🧡💛💚💙💜 first of alll, love your humor, second of all amazing content struturing it is so well organized an succinct and i will do what all the other people in the comment section did compliment how good your videos are. much love !

  • @halitturanarican3434
    @halitturanarican3434 27 днів тому

    Thank you very much. This cleared the concept for me :)

  • @jw200
    @jw200 11 місяців тому +2

    No Promises that I learned to Promise.
    Excellent tuts and explanations. Liked and subbed! Love your energy🙂

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

    Wow. That's a great one about promises. 💚

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

    You teach so creatively

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

    Glad I found your channel. It's the best explanation of the Promise and Async Await. Can you please do a series on the same topic for database CRUD? Thank you.

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

      I'm considering doing one on CRUD operations with Firebase.

  • @th3ja
    @th3ja 5 місяців тому +1

    Top notch content!

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

    Very smooth,keep up the good work bro

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

    Please keep this JS series. I like your explanation!

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

      It's going to continue :)

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

      @@ColorCodeio really nice video, please do continue!

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

    Fantastic!!

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

    Loved the intro 🔥.

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

    Great .Thank you so much.

  • @robelgeremew8343
    @robelgeremew8343 22 дні тому

    love the intro

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

    Bro thank you for this amazing video

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

    Amazing explanation! I have been enjoying your series quite a lot. Looking forward to other videos. Btw, there is a small error in the video, fetch by default returns a Promise, we don't need to create it ourselves :)
    Have a nice day/night!

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

    I know this video is old, but i’ve been coming back to this “10 things you should know…” series every time one of these topics comes up in the Odin Project and they always just make everything click

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

    Great content as usual. Please upload video consistently

  • @Walid-Sahab
    @Walid-Sahab Рік тому

    جانی بہترین ہوگیا 🔥 🤍

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

    I am giving a Promise that i will do practice and learn with this video ....Thank you

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

    Great explanation.. thank you 👏

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

    Cheers what a beautiful Teaching thank you so much for this Video!!!

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

    "im sick and tired of your broken promises, promises" -3LW Thanks for always upholding your end of the promise Sina!

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

    Love the way you explain everything.❤❤ Can you make a video on hoisting in javascript and stuff like javascript execution context.

  • @m.hakania2251
    @m.hakania2251 Рік тому +1

    You probably know and probably that's the reason you're making your videos this way, I love the way you constructed your videos!! (from a bro to bro comment)

  • @RoockYou
    @RoockYou 9 місяців тому +1

    Your explanation is so funny and so helpful at the same time, Hope you keep doing videos this way

  • @sujith.m.s4041
    @sujith.m.s4041 8 місяців тому +1

    I got stuck in promise and call back for like 2 days, this reslly helped a lot

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

    thank you so much Mr Sina. Promises confused me a lot. God bless

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

    ممنونم بابت توضیحات عالیتون.
    واقعاً به این ویدئو نیاز داشتم... :)) ❤

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

    29:10 A usecase for passing in onError in the .then() is to provide fallback data. For example, if fun1 rejects and then if the onError returns some data, then having fun1().then(fun2, onError).then(onSuccess) means that the onSuccess function will always receive some data, either fun1 resolves successfully and it's all good and well, or onError happens and that provides a fallback value so that onSuccess can always assume it has some data.

  • @user-mw5bm2xh9x
    @user-mw5bm2xh9x 7 місяців тому +1

    thanks for the lesson

  • @sameershende7770
    @sameershende7770 6 місяців тому +1

    Thank you so much. I was really confused on this topic but now I am confident with it.
    I PROMISE 😅😂.

  • @user-tx9pq6np5o
    @user-tx9pq6np5o Рік тому +1

    11:22 HOLD ON, COFFEE SIP *Music Intensifies" hahaha great tutorial, thank you!

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

    very underrated channel! glad i found you