PassFront
  1. PassFront
  2. База знаний
  3. Хуки

Какие hooks помимо useState и useEffect применяются на практике и какие задачи они решают?

Хуки

Помимо useState и useEffect в рабочем наборе React-разработчика ещё около десятка хуков — каждый под свою задачу.

Постоянно используемые

useRef — DOM-доступ (фокус, измерения) и мутируемые данные без ререндера (таймеры, инстансы, флаги).

useContext — чтение контекста: тема, текущий пользователь, DI сервисов — без prop drilling.

useMemo — кеш дорогих вычислений и стабильные ссылки на объекты/массивы (для props memo-детей и deps).

useCallback — стабильные ссылки на функции: не ломать React.memo и не перезапускать эффекты.

useReducer — сложное взаимосвязанное состояние с централизованными переходами (формы-визарды, корзины); тестируемый чистый редьюсер и стабильный dispatch.

Регулярно, по ситуации

useLayoutEffect — измерить DOM и поправить до отрисовки кадра (тултипы, позиционирование) — против «мигания».

useTransition / useDeferredValue (React 18) — пометить тяжёлые обновления несрочными: ввод не «замерзает» при фильтрации больших списков.

useId — стабильные id для доступности и SSR (label/htmlFor).

useImperativeHandle (+ ref) — опубликовать узкий императивный API компонента (focus, reset).

useSyncExternalStore — корректная подписка на внешние сторы (обычно внутри библиотек).

React 19

use — чтение промисов и контекста (можно в условиях); useActionState/useOptimistic — формы с оптимистичными обновлениями.

Плюс кастомные хуки

Библиотечные (useQuery, useForm, useSelector) и свои (useDebounce, useLocalStorage, useOnClickOutside) — композиция базовых.

Коротко для собеседования

Рабочий набор: useRef (DOM и данные без ререндера), useContext (сквозные данные), useMemo/useCallback (мемоизация значений и функций), useReducer (сложное состояние). Ситуационно: useLayoutEffect (до отрисовки), useTransition/useDeferredValue (отзывчивость), useId (SSR/a11y), useImperativeHandle. Поверх — кастомные и библиотечные хуки.

Другие вопросы раздела