If there is a line that needs to fetch any information from a database, for example, it will kick off that data fetching and
continue reading the next lines immediately, instead of waiting for the fetching to be done.
This was fine until you encounter what developers call Callback Hell, which is a callback within a callback, within a callback, and so on, which makes it very difficult to read and maintain the code.
A promise is the state of the result that gets return, so instead of having 10 lines of code indented with all those callbacks you can do it step by step. If something bad happens to the data, then you have an error handling, such as try catch. If you get the data successfully, then you execute a code, and like this, you write
.then for each action that you want.
Async + Await is the same as promises but with a better syntax. Rather than having
.then, we can put
await in front of the promise and it will temporarily freeze that line of code until the promise is resolved or rejected, and then continues reading the following lines.
promises.all() are Mega promises, which are no other thing than a promise made of many promises, and it will return a promise where it will only resolve itself when all pieces of data are resolved.
Most new browser API's are build on native promises. Fetch is the way to get data from an API, so we can use await fetching data.
The fetch API is like a double promise, because you fetch some data from your API and then you need to convert that data (most of the time we want to convert it into JSON). Axios is also based on promises and they have some JSON defaults, so we don't need to convert the data.
util package has a promisify function that converts callback-based functions to promise-based functions, so we can use our code on callback-based API's.
Since Async + Await is not built in every browser, something that we can do in order to make our code compatible with everything, is to go to Babel.com and convert the code.
Error handling methods, such as
try-catch, let you place the code that you want to execute in your program in the
try part, and if anything happens, any errors can be handle in the
There is no way to abort or cancel a promise, when, for example, you have two fetch requests going at the same time. One thing that you can do is
abortController(), which will cancel one or more web requests.