Логотип YeaHub

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

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

Тренажёр

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

Обучение

Навыки

Войти

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

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

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про React: setinterval, cleanup, unmount

Почему setInterval нужно очищать при размонтировании компонента?

Вопрос проверяет понимание сайд-эффектов, жизненного цикла компонента и типичных проблем: утечки памяти и обновления состояния после unmount.

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

setInterval продолжает работать даже после того, как компонент исчез со страницы, потому что он живёт отдельно от React. Если интервал не очистить, он будет дальше выполнять код, тратить ресурсы и может пытаться обновлять state уже размонтированного компонента. Это приводит к лишним вычислениям, странным багам и предупреждениям в консоли. Поэтому таймеры нужно останавливать в cleanup-функции useEffect.

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

В React любые “внешние” действия (таймеры, подписки, WebSocket) нужно корректно завершать, когда компонент больше не нужен.

Определение

Очистка (cleanup) эффекта — это функция, которую React вызывает при размонтировании компонента (и перед повторным запуском эффекта), чтобы остановить побочные процессы: таймеры, подписки, слушатели событий.

Что произойдёт, если не очищать setInterval

  1. Лишняя нагрузка

    • интервал продолжит срабатывать бесконечно, даже если UI уже не отображается.

  2. Утечка ресурсов

    • со временем на странице может накопиться много “висящих” интервалов.

  3. Попытки обновить состояние после unmount

    • если внутри интервала есть setState, он будет вызываться “в никуда”, что часто приводит к предупреждениям/неожиданному поведению.

  4. Скрытые баги

    • например, интервал обновляет общий объект/стор и ломает логику других частей приложения.

Как это правильно делается в React

Нужно возвращать функцию очистки из useEffect:

useEffect(() => {
  const id = window.setInterval(() => {
    // ...делаем работу
  }, 1000);

  return () => window.clearInterval(id);
}, []);

Вывод

setInterval — это сайд-эффект, который не управляется React автоматически, поэтому его нужно останавливать при unmount, чтобы избежать утечек и обновлений состояния “после смерти” компонента.

Уровень

  • Рейтинг:

    5

  • Сложность:

    4

Навыки

  • React

    React

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

#setinterval

#cleanup

#unmount

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