In this article I will give you a couple of reasons why the new Asynchronous functions from Javascript ES 2017 are better than Promises. In case you didn’t know, the Async/Await is fully supported by Node since 8.0.0.

What is Async/Await?

This is a new simplified way to write asynchronous code in Javascript ES 2017. Working with and writing chained promises is a lot easier this way. Async/await was actually built on top of promises but it can’t be used with plain callbacks or node callbacks.

How Async/Await works

When an async function is called, it returns a Promise. When the async function returns a value, the Promise will be resolved with the returned value.  When the async function throws an exception or some value, the Promise will be rejected with the thrown value.

The await expression causes async function execution to pause until  a Promise is fulfilled or rejected, and to resume execution of the async function after fulfillment. When resumed, the value of the await expression is that of the fulfilled Promise.

Syntax example

There is not much to write about the syntax. All you need to make a function asynchronous is to add the async word before the function like this:

const getUser = async () => {

}

For await you will have to do something like:

await getUserById();

Now putting both together would look like:

const getUser = async (userId) => {
  console.log(await getUserById(userId));
  return 'fetched';
}

An important thing to note is that await can only be used inside the async.

This is how the code above works:

  1. Because the getUser() function is async, it will return a promise which will have as the resolve value the fetched string.
  2. The console.log will wait until the promise returned by getUserById(userId) is resolved, then print the value.

If you want to use promises instead, the code would look like:

const getUser = (userId) => {
  return new Promise(resolve => {
    return getUserById(userId).then((user) => {
      console.log(user);
      resolve('fetched');
    });
  });
}

Still not impressed?

Here are few more reasons to use the async/await instead of promises or callbacks:

  1. Debugging is a lot easier than promises. Debugging promises is a pain because you can’t set breakpoints in arrow functions that return expressions and if you set a breakpoint inside a .then, is not possible to use shortcuts like step-over.
  2. No need to use Promise.all anymore. Before, if you wanted to use the value of promise1 and promise2 inside promise3, you would have to wrap the first 2 promises in a Promise.all then use that inside the third promise.
  3. The error stack from async/await points to the function that contains the error compared to the error stack returned from a promise chain which is more confusing and harder to debug because it doesn’t tell you exactly where the problem is and sometimes it can even point you to the wrong part of the code.
  4. With async/await you can handle both synchronous and asynchronous errors by using try/catch.

That’s all for now but if you have any questions or would like to contribute with more pros/cons, please leave a comment below.

Andy

Andy

Highly creative and reliable UI Software Engineer and Designer based in Dublin with over 9 years experience currently working at IBM.