Какая область видимости у компонентов?

У «области видимости» компонентов два осмысленных прочтения: JS-скоупы внутри компонента (замыкания рендера) и видимость данных между компонентами (state/props/context). Оба стоит раскрыть.

Скоуп внутри компонента: замыкания рендера

Функциональный компонент — обычная функция: каждый вызов (рендер) создаёт свой скоуп с локальными переменными:

const Timer = () => {
  const [count, setCount] = useState(0);  // count — const ЭТОГО рендера

  const handleClick = () => {
    console.log(count);  // замкнул count своего рендера («снимок»)
  };
  ...
};

Обработчики и эффекты «фотографируют» значения того рендера, где созданы, — отсюда stale closures в таймерах/подписках и лекарства: функциональные сеттеры, честные deps, ref для «всегда актуального».

Состояние при этом живёт вне скоупа функции — на fiber-узле React (потому и переживает рендеры).

Видимость между компонентами

• State приватен: состояние компонента видно только ему; два экземпляра — независимые состояния. Наружу — только явно: вниз через props, вверх через колбэки.
• Props видны получателю (read-only).
• Context — «динамическая область видимости» по поддереву: значение провайдера видно всем потомкам, ближайший провайдер перекрывает внешний.
• Модульный скоуп: сам компонент виден там, куда импортирован (export/import) — обычные правила модулей JS.

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

Внутри: каждый рендер — новый скоуп-замыкание со «снимком» props/state (state живёт в React, не в функции) — отсюда stale closures. Между компонентами: state приватен, наружу только через props/колбэки; context даёт видимость по поддереву с перекрытием ближайшим провайдером; сам компонент — обычный модульный экспорт.