Async/Await….and Promises, what?
Throughout my journey in Javascript I repeatedly heard “asynchronous behavior” but never really grasped what it actually meant. Engineering bootcamp was so intense and loaded with so much information that I just wanted to make it through unscathed and figure out all the things I was cloudy about later. One of these many, many things was figuring out exactly what the words ‘async’ and ‘await’ were really doing.
I vaguely remember my Javascript instructor using an example of getting ready in the morning: brush your teeth, take a shower, make coffee, eat breakfast, get dressed. If we want to be efficient though, we can make coffee while we brush our teeth, we can eat breakfast and then get dressed. Basically this is asynchronous behavior, we can have certain functions firing off in a specific order while other functions wait for those functions to finish before they execute.
Below I’ve written some code showing asynchronous behavior. Firstly you see this keyword Promise , what is a Promise when it relates to Javascript? The Promise object represents the eventual completion (or failure) of an asynchronous operation and its resulting value. I’d like to make a joke about promise rings here but I can’t really think of a way to smoothly add it in, so comedic writing is not in my future! On line 20 I’ve given the function morningRoutine an argument of ‘drink coffee’, below that image is the executed code. Depending on the parameter given to the morningRoutine function, the promise will either be resolved or rejected.
I am lazy developer though and that’s a whole lot of unnecessary code which can be way more efficient! Introducing async & await …..*applause & cheering in the background, imagine the words walking the aisle to accept their award* Using the async keyword before our function, we are telling Javascript how to process the behavior that’s happening within our asynchronous function and how to handle the await keyword within the function. The await keyword tells Javascript to wait until morningRoutine is finished executing and then go onto the processRoutine function.
BONUS
If you’re wondering how do we handle errors Dolly ?? Developers live in the land of broken, what are we going to do if something breaks because something always breaks!!!! Yes the previous callback had .catch that would fire off if the promise is rejected. We can still catch errors with async & await. Let’s give another round of applause to try, this keyword catches errors.
Now that I understand asynchronous behavior and actually walked myself through it, it's not so scary ! The more and more I take time to understand code and what it does, the less and less I am scared of code. I’ve been on this journey for over 6 months and there’s still many times that I feel like my computer is going to bite me for being wrong. I hope this blog has been helpful, now give me my claps please, thaaannnnkkssssss.
