I `Promise` you won't have to `await` long to understand `async` in Javascript
As you're poking around with modern Javascript, it won't take you long to encounter one of the main asynchronous keywords: Promise, await, or async. So, how do these they work, and why would you want to use them? (And then at the end, some pro-tips for getting the most out of them.)
As with all things in asynchronous programming, we'll answer those questions eventually but the order in which we'll do so is not defined.
Since the beginning, Javascript has lived on the internet. This necessarily means that it has had to deal with tasks that could take an indeterminate amount of time (usually calls from your device out to a server somewhere). The way that Javascript dealt with this traditionally has been with "callbacks":
Callbacks are references to functions that get called when the work is done. Our loadDataFromSite function above will call our callback with image defined if and when it has successfully loaded the data from the target URL. If it fails, it will call our callback with image set to null and, hopefully, error defined.
This works fine when you're dealing with simple "get it and do one thing" loops. However, this can quickly enter callback hell if you need to do multiple chained calls to a server:
