Learn React Hooks

The async/await construct

Normal functions are defined as follows:

function doSomething () {    // ...}

Normal anonymous functions are defined as follows:

() => {    // ...}

Asynchronous functions are defined by adding the async keyword:

async function doSomething () {    // ...}

We can also make anonymous functions asynchronous:

async () => {    // ...}

Within async functions, we can use the await keyword to resolve promises. We do not have to do the following anymore:

() => {    fetchAPITodos()        .then(todos => dispatch({ type: FETCH_TODOS, todos }))}

Instead, we can now do this:

async () => {    const todos = await fetchAPITodos()    dispatch({ type: FETCH_TODOS, todos })}

As we can see, async functions make our code much more concise and easier to read! Now ...