В чем разница между React Context и useContext?
Хуки
Это не конкурирующие вещи, а части одного механизма: React Context — сам инструмент (объект контекста с Provider), useContext — хук для его чтения в функциональном компоненте.
Как соотносятся
// 1. Context — создание объекта контекста
const ThemeContext = createContext('light');
// 2. Provider — часть Context: кладёт значение в поддерево
<ThemeContext.Provider value="dark">
<App />
</ThemeContext.Provider>
// 3. useContext — способ ПРОЧИТАТЬ это значение
const theme = useContext(ThemeContext);Context без useContext возможен (другие способы чтения), useContext без Context — нет: хук принимает объект контекста аргументом.
Способы чтения контекста
- useContext(Ctx) — стандартный способ в функциональных компонентах (React 16.8+).
- `<Ctx.Consumer>{(value) => ...}</Ctx.Consumer>` — render-prop, дохуковый способ (актуален разве что в классах).
- static contextType = Ctx — для классовых компонентов (this.context).
- В React 19 добавился
use(Ctx)— как useContext, но можно вызывать в условиях.
Все способы эквивалентны по поведению: компонент-читатель перерендеривается при изменении value ближайшего провайдера.
Почему возникает путаница
В обиходе «использовать Context» и «использовать useContext» звучат взаимозаменяемо. Корректно так: Context — механизм передачи данных сквозь дерево (createContext + Provider), useContext — API доступа к нему из хуков.
Коротко для собеседования
React Context — сам механизм: createContext создаёт объект, Provider кладёт значение в поддерево. useContext — хук, читающий это значение (одна из форм чтения наряду с Consumer и contextType в классах). Сравнивать их как альтернативы некорректно — хук работает поверх контекста.