Sobes.tech
Middle

Jak współdziałasz z pętlą zdarzeń (event loop)?

sobes.tech AI

Odpowiedź od AI

Nie wchodzę w bezpośrednią interakcję z pętlą zdarzeń, ponieważ jest to mechanika wewnętrzna silnika JavaScript (np. V8 w Node.js i przeglądarkach). Moja interakcja odbywa się pośrednio, poprzez operacje asynchroniczne.

Główne punkty styku:

  • Timery: setTimeout, setInterval. Umieszczają zadania w kolejce callbacków, które będą wykonywane przez pętlę zdarzeń po upływie czasu.
  • Obietnice: Promise. Ich metody (then, catch, finally) rejestrują callbacki, które są wykonywane asynchronicznie w mikrotaskach pętli zdarzeń.
  • Asynchroniczne operacje wejścia/wyjścia: Zapytania do serwera (fetch, XMLHttpRequest), praca z systemem plików w Node.js. Ich zakończenie powoduje umieszczenie odpowiednich callbacków w kolejce makro- lub mikrotasków.
  • Obsługiwacze zdarzeń DOM: addEventListener. Callbacki obsługi są wykonywane, gdy pętla zdarzeń obsługuje zdarzenie występujące w DOM.

Przykład użycia obietnic do operacji asynchronicznej:

// Funkcja asynchroniczna
async function fetchData(url) {
  try {
    const response = await fetch(url); // Operacja asynchroniczna
    if (!response.ok) {
      throw new Error(`Błąd HTTP: ${response.status}`);
    }
    const data = await response.json(); // Operacja asynchroniczna
    return data;
  } catch (error) {
    console.error('Błąd podczas pobierania danych:', error);
    throw error; // Ponowne rzucenie
  }
}

// Wywołanie funkcji asynchronicznej i obsługa wyniku
fetchData('https://api.example.com/data')
  .then(data => {
    console.log('Odebrane dane:', data); // Ten callback wykona się asynchronicznie
  })
  .catch(error => {
    console.error('Wystąpił błąd:', error); // Ten callback wykona się w przypadku błędu
  });

console.log('Ten kod wykona się PRZED zakończeniem operacji asynchronicznych.'); // Kod synchroniczny

Zrozumienie, jak działa pętla zdarzeń, pomaga mi pisać kod nieblokujący, efektywnie zarządzać operacjami asynchronicznymi i unikać "zamrożenia" interfejsu użytkownika. Biorę pod uwagę, że długie operacje synchroniczne blokują główny wątek i pętlę zdarzeń, dlatego staram się ich unikać lub przenosić do web workerów.