What is the difference between useState and useReducer?
Why Interviewers Ask This
Candidates at the intermediate level are expected to not only know this concept but explain the trade-offs involved. Interviewers use this question to see if you can reason about design decisions, not just recall facts.
Answer
Both manage state in function components, but they serve different use cases. useState is simpler — best for independent pieces of state: booleans, strings, numbers, simple objects. Each call manages one value. useReducer centralizes state updates into a pure reducer function — best when: (1) State is a complex object with multiple sub-values. (2) State updates depend on each other. (3) There are many different ways to update state (many action types). (4) The next state depends on the previous state in complex ways. (5) You want to extract and test state logic separately. Mental model: useState = simple variable; useReducer = Redux-lite (state + actions + reducer). When to migrate: if you find yourself writing many related useState calls that update together, or complex conditional update logic, refactor to useReducer. Performance: useReducer can be marginally more efficient in some cases because the dispatch function is stable (never recreated). useReducer + useContext: combine for lightweight global state management that avoids Redux for medium-sized apps.
Common Mistake
Candidates often give textbook answers here. Interviewers are more impressed when you relate the concept to a specific problem you solved in a real React.js project.