Async + Await

I promise you'll like this talk

Ugh

I'm Wes Bos


Async+Await

Flow Control in JS is Hard

Promises

The Foundation of Async + Await

Promises are an IOU for something that will happen in the future

All of these things take time, we simply kick off the process and move along with our lives.

But why do we do it this way?

JavaScript Waits for no one!

Almost Everything Is Asynchronous

Let's say we wanted to do a few things:

Do you need to finish making coffee before you can Start Breakfast?



Would it make sense to wait until coffee is made and consumed before we even start cooking breakfast?

no!

we want to start one thing, come back to it once it's finished, and deal with the result accordingly!

Christmas Tree Callback Hell

Most new browser APIs are built on Promises

fetch()

Axios

Many, many more

PaymentRequest, getUserMedia(), Web Animation API

It's easy to make your own too!

we get it
Promises are great.

buuuuuuttt

What's the deal with .then()?

It's still kinda callback-y

Any code that needs to come after the promise still needs to be in the final .then() callback
😕😕😕

Async
+
Await

Async + Await still is promises,
but with a really nice syntax

Let's break it down

JavaScript is almost entirely asynchronous / non-blocking

great!
But it's hard to read/write

PHP

JS

😕😕😕

The PHP is easier to read

The JS is more performant

I'm not really happy

Synchronous looking code, without the wait!

How does it work?

1. Mark it as Async

2. await inside your async fn

Best of Both Worlds!

Another Example

Slow...

Why wait for Wes?

Remember, async+await is just promises

Error Handling

A few options

Option #1

Make sure Errors Don't Happen

Why waste dev time on something that should never happen? #ProblemSolved

Option #2

Try / Catch

Wrap that sucker in a safety blanket

Option #3

Higher Order Function

Async Functions can chain a .catch()

Just Live Your Life

Create a HOF

Hot Shot Implicit Return (WHAT)

Create a new function with your HOF

Very Handy in Node & Express!

Normally we'd Handle each possible Error with next()

🤔 But that doesn't cover errors we throw, unhandled errors or syntax errors...

We need to catch all errors and pass along to the next middleware function

Enter HOF

Then we just wrap our routes!

Any unhandled error will simply get passed along to next()

Option #4

Handle The Error When you Call it

Option #5

Node's Unhandled Rejection Event

Node.js will soon exit your process on unhandled rejected promises

It's the Future!

Tips for Starting today

  1. Write your APIs in Promises
  2. Use Async + Await for Flow Control
  3. Convert Older APIs with Promisify
  4. Choose an Error Handling Strategy

Thanks!

I'm @wesbos