React interviews mix framework specifics — hooks, rendering, state — with JavaScript fundamentals that decide whether you actually understand what React is doing. Below are the most common questions with model answers. Junior: core theory, definitions, and simple practical cases.
It tells React which values the effect reads, so the effect re-runs only when one of them changes. An empty array means run once after mount; omitting the array entirely means run after every render, which is how infinite loops start. Leaving a used value out is the other failure — the effect closes over a stale value and keeps using it forever.
The key tells React which element in the new list corresponds to which in the old one, so it can move a node instead of rebuilding it. Using the index breaks that as soon as the list reorders or an item is removed: React matches by position, so the wrong component keeps the wrong state — a checked checkbox jumps to a different row.
Props are passed in from the parent and are read-only in the component that receives them. State is owned by the component and changing it triggers a re-render. If two components need the same value, it belongs in their nearest common parent and comes down as props — that is what "lifting state up" means.
React decides whether to re-render by comparing the previous value with the new one by reference. Pushing into an array leaves the reference unchanged, so React concludes nothing happened and skips the render — the data is updated and the screen is not. You replace the value instead: a new array, a new object.
A controlled input has its value driven by React state and an onChange that writes back, so state is the single source of truth. An uncontrolled one keeps its value in the DOM and you read it through a ref. Controlled is the default because validation, formatting and conditional disabling all need the value during render; uncontrolled is for cases where re-rendering on every keystroke is wasteful.
React identifies hooks by call order, not by name — the first useState in a component is always the same piece of state. A hook inside an if changes that order between renders, so React hands back the wrong state to the wrong hook. That is why the rule is call them unconditionally at the top level, and put the condition inside the hook instead.
It bails out: if the new value is identical by Object.is to the current one, React does not re-render. That is why setting a primitive to the same number is free, and why setting an object to a structurally identical but newly created one is not — the reference differs, so React re-renders even though nothing visibly changed.
In a real interview you speak under pressure. Cam asks these same questions, scores every answer, and shows exactly what to fix.
Practice a Junior React Frontend interview →