useEffect

React 🟢 Junior

Definition

Hook pour synchroniser un composant avec un systeme externe (API, DOM, timer). S'execute apres le rendu, avec un tableau de dependances pour controler quand il se relance.

Analogie

Comme un abonnement a un journal : tu t'abonnes (setup), tu recois les numeros (re-runs), et tu te desabonnes (cleanup) en partant.

Exemple de code

useEffect(() => {
  const ctrl = new AbortController();
  fetch('/api/data', { signal: ctrl.signal })
    .then(r => r.json())
    .then(setData);
  return () => ctrl.abort(); // cleanup
}, [userId]); // re-run si userId change

Cas d'usage

Appels API, abonnements WebSocket, synchronisation avec le DOM ou des librairies externes.

Anti-pattern

Omettre des dependances pour 'eviter les re-runs', causant des stale closures avec des valeurs perimees.
#hooks#interview#fundamentals