Что такое useState?
Хуки
useState — базовый хук для хранения состояния в функциональном компоненте. Возвращает текущее значение и функцию для его обновления; обновление вызывает перерендер.
Сигнатура
const [count, setCount] = useState(0);
const [user, setUser] = useState(null);Возвращает массив из двух элементов (деструктурируется): текущее значение и сеттер.
Механики
Обновление через функцию — когда новое значение зависит от предыдущего:
setCount((prev) => prev + 1); // безопасно при нескольких обновлениях подрядЛенивая инициализация — если начальное значение дорого вычислять:
const [data, setData] = useState(() => parseHugeJson(raw)); // вызовется один разИммутабельность — объекты и массивы не мутируют, а создают заново:
setUser({ ...user, name: 'Аня' });
setItems([...items, newItem]);Если передать в сеттер то же самое значение (по Object.is), React пропустит перерендер.
Нюансы
- Обновления асинхронны и батчатся: после вызова
setCount(1)переменнаяcountв текущем замыкании не меняется — новое значение придёт со следующим рендером. - React хранит state вне компонента и сопоставляет его по порядку вызова хуков — поэтому хуки нельзя вызывать в условиях и циклах.
- Много связанных полей — повод для
useReducerили объединения в объект.
Коротко для собеседования
useState возвращает пару «значение + сеттер»; вызов сеттера планирует перерендер. Обновления батчатся и применяются асинхронно; для зависимости от предыдущего значения — функциональная форма сеттера; объекты обновляются иммутабельно; начальное значение можно задать лениво функцией.