Зачем нужна функция в качестве аргумента в setState?
Функции
Функция в качестве аргумента `setState` нужна, чтобы обновить состояние на основе его предыдущего значения корректно — из-за асинхронности и батчинга `setState` прямое использование текущего значения может дать неверный результат.
Проблема
setState асинхронный и батчит обновления. Прямое использование текущего состояния при нескольких обновлениях подряд даёт неверный результат:
// Плохо — count один и тот же во всех вызовах
setCount(count + 1);
setCount(count + 1);
setCount(count + 1); // итог +1, а не +3!Все три используют одно (устаревшее) значение count.
Решение — функциональное обновление
Передать функцию, получающую актуальное предыдущее значение:
setCount((prev) => prev + 1);
setCount((prev) => prev + 1);
setCount((prev) => prev + 1); // итог +3 ✓React применяет функции последовательно, каждая получает результат предыдущей.
Когда нужна функция
- Новое состояние зависит от предыдущего (счётчики, toggle, накопление).
- Несколько обновлений подряд в одном обработчике.
- Обновление в асинхронном коллбэке/замыкании, где текущее значение может устареть:
setTimeout(() => setCount((prev) => prev + 1), 1000); // актуальное значениеКогда можно без функции
Когда новое значение не зависит от старого:
setName('Bob'); // прямое значение — окКоротко для собеседования
Функцию в setState (setCount(prev => prev + 1)) используют, когда новое состояние зависит от предыдущего — из-за асинхронности и батчинга прямое setCount(count + 1) при нескольких вызовах подряд даёт неверный результат (все берут устаревшее значение). Функциональная форма получает актуальное предыдущее значение. Для независимых значений можно без функции.