useReducer

React 🟡 Mid

Définition

Hook alternatif a useState pour gérer un état complexe avec une logique de type action/reducer, inspire de Redux.

Analogie

Comme un standard téléphonique : tu envoies un message (action) et l'opérateur (reducer) décidé quoi faire.

Exemple de code

const reducer = (state, action) => {
  switch(action.type) {
    case 'increment': return { count: state.count + 1 };
    case 'reset': return { count: 0 };
    default: return state;
  }
};
const [state, dispatch] = useReducer(reducer, { count: 0 });

Cas d'usage

États complexes avec plusieurs sous-valeurs interdépendantes ou quand la logique de transition est élaborée.

Anti-pattern

Utiliser useReducer pour un simple toggle booléen : useState est plus simple et lisible.

Termes liés

#hooks#interview#state

En entretien

Quelle différence entre useReducer et useState ?
useReducer gère un état complexe avec une logique de type action/reducer inspirée de Redux, comme un standard téléphonique où tu envoies un message (action) et l'opérateur (reducer) décide quoi faire. On l'utilise pour des états complexes avec plusieurs sous-valeurs interdépendantes.
Quand est-ce que tu éviterais useReducer ?
Pour un simple toggle booléen, useState est plus simple et plus lisible. useReducer se justifie surtout quand la logique de transition d'état devient élaborée.

Fiche mise à jour le 2026-09-27