Lesson 4 of 8
Asynchronous code and waiting
- 15 min
- 4 checks
- 3 hints
- Go to task
Goal
Promises and async/await
Explanation
Some operations take time, like fetching data from a server, reading a file or waiting for a reply. JavaScript doesn't stop and wait for them to finish: it keeps running the rest of the code and comes back to the result when it's ready.
A Promise is a value that will arrive later, and the keyword await means "wait here until the value arrives". Any function that uses await must be declared with async.
That's why an interface needs a loading state the user can see between sending the request and getting the result. Otherwise they'll think something broke.
Your task
When the button is clicked, show "Loading…", then wait with wait(600), then show "Loaded".
Checks
4 checks- Clicking shows a loading state right away
- The loading state is still there after 200 milliseconds
- Once the wait is over, "Loaded" appears
- A second click shows the loading state again