Логотип YeaHub

База вопросов

Собеседования

Тренажёр

База ресурсов

Обучение

Навыки

Войти

Выбери, каким будет IT завтра — вместе c нами!

YeaHub — это полностью открытый проект, призванный объединить и улучшить IT-сферу. Наш исходный код доступен для просмотра на GitHub. Дизайн проекта также открыт для ознакомления в Figma.

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про React: state

Чем отличается изменение состояния в классовых и функциональных компонентах?

Этот вопрос проверяет понимание различий в управлении состоянием между двумя основными типами React-компонентов

Короткий ответ

  • В классовых компонентах состояние хранится в this.state и изменяется через this.setState().

  • В функциональных (с хуками) состояние создается через useState() и обновляется вызовом функции-сеттера.

Длинный ответ

1. Классовые компоненты

Состояние инициализируется в конструкторе:

class Counter extends React.Component {
  	constructor(props) {
    		super(props);
    		this.state = { count: 0 };
  	}
}

Для обновления используется this.setState():

increment = () => {
  	this.setState({ count: this.state.count + 1 });
};

setState может принимать функцию для зависимых обновлений:

this.setState((prevState) => ({ count: prevState.count + 1 }));

2. Функциональные компоненты (с хуками)

Состояние объявляется через useState:

import { useState } from 'react';

function Counter() {
  	const [count, setCount] = useState(0);
}

Обновление происходит вызовом функции-сеттера (setCount):

const increment = () => {
  	setCount(count + 1);
};

Для сложных обновлений можно передать функцию:

setCount(prevCount => prevCount + 1);

Уровень

  • Рейтинг:

    3

  • Сложность:

    6

Навыки

  • React

    React

Ключевые слова

#state

Подпишись на React Developer в телеграм