What is the useContext hook?
Why Interviewers Ask This
This question tests conceptual clarity. Interviewers want to hear a precise, confident definition before moving to more complex React.js topics. It also reveals how well you can explain technical ideas to non-experts.
Answer
useContext is a React hook that lets a component read and subscribe to a React Context. Context provides a way to share values (like themes, user data, or locale) across the component tree without passing props through every level ("prop drilling"). Setup: (1) Create context: const ThemeContext = createContext("light");. (2) Provide a value: <ThemeContext.Provider value="dark"><App /></ThemeContext.Provider>. (3) Consume anywhere in the tree: const theme = useContext(ThemeContext);. When the context value changes, all components using that context re-render. This is the main performance concern — if the context value is an object created inline (value={{ user, logout }}), it is a new object every render and causes all consumers to re-render. Fix by memoizing the value or splitting into multiple contexts. Use context for: authentication, themes, localization, and other "ambient" data. For frequently changing data (like a counter), state or external libraries (Zustand, Redux) are better.
Common Mistake
A common mistake is memorizing definitions without understanding implications. When asked this question, go one level deeper — explain what happens when this concept is misused or ignored.