Async await (Javascript)

Task

Learning objectives:

Most students should:

• Know how to write code using async/await

• Understand how the async/await keywords makes working with promises simpler

• Demonstrate how to convert from .then()/.catch functions to using async await

Students will already:

• Have had roughly 65 hours of tuition and practise with javascript

• Understand how to use promises using the .then()/.catch() functions

Resources you can use:

You can use these resources to help build your lesson plan

• https://dev.to/lydiahallie/javascript-visualized-promises-async-await-5gke

• https://javascript.info/async-await

• https://www.freecodecamp.org/news/learn-promise-async-await-in-20-minutes/

• https://github.com/changetocoding/WebLessonPlan/blob/main/Lesson18-AsyncAwait.md

Detailed Notes:

We recommend you use visual studio code as your IDE. This is the IDE students are familiar with.

Explain what async is and show an async function

async function returnNumber()
{
  return 5;
}

returnNumber().then(console.log);

Explain the await keyword and how to use in an async function

async function getDataFromAPI()
{ 
  data = await fetch('http://example.com/movies.json') 
}

Show how to rewrite a function using async await instead of then/catch

See this example: https://javascript.info/async-await#rewrite-using-async-await