Nearby lessons

21 of 22

JavaScript: async/await

📌 What is async/await?

The async and await keywords make it easier to work with asynchronous code. async functions return a Promise, and await pauses the execution until the Promise is resolved.

1️⃣ Basic async Function (Technique 1)

An async function always returns a Promise. You can use .then() to handle the result.

Example02
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

2️⃣ async Function as Function Expression (Technique 2)

You can also define async functions using function expressions.

Example03
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

3️⃣ async Arrow Function (Technique 3)

async can also be used with arrow functions.

Example04
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

4️⃣ async Function Without await

If you don’t use await, the code runs like a normal synchronous function.

Example05
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

5️⃣ async Function With await

await pauses the function until the awaited expression is resolved. It only works inside async functions.

Example06
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

6️⃣ fetch with async/await - Flow Example

This shows how async/await pauses execution during API calls using fetch().

Example07
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

7️⃣ fetch with async/await and .then/.catch

You can combine async/await with .then() and .catch() to handle responses and errors.

Example08
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

🧠 Test Your Knowledge

3 Questions
Progress: 0 / 3