Hoe werkt async/await?

Question

Accepted Answer

`async/await` is **syntactic sugar over Promises** waarmee je asynchrone code kunt schrijven die uitziet als synchrone code. Een `async` functie retourneert altijd een Promise; `await` pauzeert de functie totdat een Promise is afgehandeld, en hervat het vervolgens met de waarde.

```js
async function loadUser(id) {
  try {
    const res = await fetch(`/api/users/${id}`); // pause until the response
    const user = await res.json();               // pause until parsed
    return user;                                  // becomes the resolved value
  } catch (err) {
    console.error(err); // catches rejections from any await above
  }
}
```

## Sequential vs parallel — een veelvoorkomende prestatiefout

`await` voert dingen **één voor één** uit. Als twee verzoeken niet van elkaar afhangen, is ze sequentieel awaiten slecht inefficiënt:

```js
// ❌ sequential — total time = a + b
const a = await getA();
const b = await getB();

// ✅ parallel — total time = max(a, b)
const [a, b] = await Promise.all([getA(), getB()]);
```

## Foutafhandeling

Gebruik `try/catch` in plaats van `.catch`. Een verworpen awaited promise gooit een fout, dus één `catch` dekt het hele blok af.

## Onder de motorkap

Het zijn nog steeds Promises en de microtask queue — `await` blokkeert de thread niet; het geeft controle aan ander code om uit te voeren, en hervat vervolgens. Vergeet niet: het aanroepen van een `async` functie zonder `await` (of `.catch`) kan fouten verbergen.

## Waarom het belangrijk is

Het maakt asynchrone flows leesbaar en is de moderne standaard voor het sequencen van asynchrone werkzaamheden — maar je moet onafhankelijke bewerkingen bewust paralleliseren met `Promise.all`.