Hoe ga je om met de situatie waarin een belofte met een fout (reject) eindigt?

Ik verwerk met de methoden .catch() of .finally().

.catch() wordt gebruikt om afgewezen promises af te handelen. Als de promise succesvol wordt opgelost, wordt het .catch()-blok genegeerd.

// Foutafhandeling met `.catch()`
fetch('/api/data')
  .then(response => {
    if (!response.ok) {
      throw new Error('Request failed'); // Simulatie van een fout
    }
    return response.json();
  })
  .then(data => {
    console.log('Data ontvangen:', data);
  })
  .catch(error => {
    console.error('Fout:', error); // Foutafhandeling hier
  });

.finally() wordt uitgevoerd ongeacht of de promise succesvol (fulfill) of afgewezen (reject) is. Het is handig voor het opruimen van resources of het verbergen van laadindicatoren.

// Gebruik van `.finally()` om code uit te voeren na het voltooien van de promise
fetch('/api/data')
  .then(response => {
    if (!response.ok) {
      throw new Error('Request failed');
    }
    return response.json();
  })
  .then(data => {
    console.log('Data ontvangen:', data);
  })
  .catch(error => {
    console.error('Fout:', error);
  })
  .finally(() => {
    console.log('Verzoek voltooid.'); // Deze code wordt altijd uitgevoerd
  });

Ik kan ook de constructie try...catch gebruiken binnen async functies om fouten in asynchrone operaties, inclusief promises, af te handelen:

// Foutafhandeling in async/await met try...catch
async function fetchData() {
  try {
    const response = await fetch('/api/data');
    if (!response.ok) {
      throw new Error('Request failed');
    }
    const data = await response.json();
    console.log('Data ontvangen:', data);
  } catch (error) {
    console.error('Fout:', error); // Foutafhandeling hier
  } finally {
    console.log('Fetch-operatie voltooid.'); // Wordt altijd uitgevoerd
  }
}

fetchData();

De keuze van methode hangt af van de context en de vereiste logica voor foutafhandeling. .catch() is de hoofdstructuur voor het reageren op fouten, en .finally() voor acties die onafhankelijk van het resultaat worden uitgevoerd. try...catch in async functies biedt een meer vertrouwde, synchrone stijl van foutafhandeling.