Hoe interacteert u met de event loop?

Ik werk niet direct met de event loop, omdat dit een interne mechaniek is van de JavaScript-engine (bijvoorbeeld V8 in Node.js en browsers). Mijn interactie gebeurt indirect, via asynchrone operaties.

De belangrijkste contactpunten:

• Timers: setTimeout, setInterval. Ze plaatsen taken in de callback-queue, die door de event loop worden uitgevoerd nadat de tijd is verstreken.
• Promises: Promise. Hun methoden (then, catch, finally) registreren callbacks die asynchroon worden uitgevoerd in de microtaken van de event loop.
• Asynchrone input/output-operaties: Verzoeken naar de server (fetch, XMLHttpRequest), werken met het bestandssysteem in Node.js. Hun voltooiing veroorzaakt het plaatsen van de bijbehorende callbacks in de macro- of microtask-queue.
• DOM-gebeurtenishandlers: addEventListener. De callbacks van handlers worden uitgevoerd wanneer de event loop een in het DOM plaatsgevonden gebeurtenis verwerkt.

Voorbeeld van het gebruik van promises voor een asynchrone operatie:

// Asynchrone functie
async function fetchData(url) {
  try {
    const response = await fetch(url); // Asynchrone operatie
    if (!response.ok) {
      throw new Error(`HTTP-fout: ${response.status}`);
    }
    const data = await response.json(); // Asynchrone operatie
    return data;
  } catch (error) {
    console.error('Fout bij het ophalen van gegevens:', error);
    throw error; // Fout doorgeven
  }
}

// Aanroepen van de asynchrone functie en verwerken van het resultaat
fetchData('https://api.example.com/data')
  .then(data => {
    console.log('Ontvangen gegevens:', data); // Deze callback wordt asynchroon uitgevoerd
  })
  .catch(error => {
    console.error('Er is een fout opgetreden:', error); // Wordt uitgevoerd bij fout
  });

console.log('Deze code wordt UITVOERD VOORDAT de asynchrone operaties zijn voltooid.'); // Synchrone code

Het begrijpen van hoe de event loop werkt, helpt me om niet-blokkerende code te schrijven, asynchrone operaties efficiënt te beheren en te voorkomen dat de gebruikersinterface vastloopt. Ik houd er rekening mee dat lange synchronische operaties de hoofdthread en de event loop blokkeren, dus probeer ik ze te vermijden of naar web workers te verplaatsen.