React MCQ Test

20 random React MCQs with answers: JSX, components and props, state, events and forms, lists and keys, useEffect, memo, context, useReducer, custom hooks and React Router.

  • 20 random questions
  • 20 minutes
  • 36 in the question bank

No sign-up needed. Answers and explanations are shown at the end.

About this test

React interviews focus on how React thinks: when a component re-renders, why keys matter, what useEffect dependencies do, and when memo or useCallback actually help.

This test covers those plus forms, context and routing.

Each attempt picks new questions at random from the question bank. You can go back and change answers until you finish or the timer runs out. At the end you see your score, the right answer and a short explanation for every question, and the lessons to revise for the ones you missed.

Sample questions with answers

1. What is React?

  1. A JavaScript library for building component-based UIs
  2. A database
  3. A CSS framework
Show answer

A. A JavaScript library for building component-based UIs — Routing and data fetching come from the ecosystem.

2. Which attribute replaces class in JSX?

  1. className
  2. cssClass
  3. class
Show answer

A. className — class is a reserved word in JavaScript.

3. Can a component change its props?

  1. Yes
  2. Only numbers
  3. No, props are read-only
Show answer

C. No, props are read-only — Changing data is state's job.

4. With count = 0, setCount(count + 1); setCount(count + 1); gives…

  1. 0
  2. 1
  3. 2
Show answer

B. 1 — Both read the same snapshot. Use setCount(c => c + 1).

5. What's wrong with onClick={handleClick()}?

  1. Nothing
  2. It's a syntax error
  3. It calls the function during render
Show answer

C. It calls the function during render — Pass the function: onClick={handleClick}.

6. What should you use as a list key?

  1. A stable unique id from the data
  2. Math.random()
  3. Always the index
Show answer

A. A stable unique id from the data — Index keys break with reordering or filtering.

7. An effect with [] dependencies runs…

  1. Once, after the first render
  2. After every render
  3. Never
Show answer

A. Once, after the first render — Add values to the array to re-run on changes.

8. When does a component re-render?

  1. Its state changes, its parent re-renders, or a context it uses changes
  2. Every second
  3. Only when props change
Show answer

A. Its state changes, its parent re-renders, or a context it uses changes — Re-render ≠ DOM update.

9. What problem does Context solve?

  1. Routing
  2. Slow rendering
  3. Prop drilling through many components
Show answer

C. Prop drilling through many components — Any descendant can read the value.

10. Changing ref.current…

  1. Always re-renders
  2. Throws an error
  3. Doesn't trigger a re-render
Show answer

C. Doesn't trigger a re-render — Use refs for DOM nodes and timer ids.