⚛️ Top 20 React JS Interview Questions and Answers for 2025 20/07/2025 ~ Views: 10
1. What is the Virtual DOM?
A lightweight copy of the real DOM. React uses it to detect changes and update only what's needed, improving performance.
2. What are components in React?
Building blocks of a UI.
- Functional components (recommended)
- Class components (legacy)
3. What are props and state?
-
Props: immutable inputs passed from parent
-
State: mutable data managed inside a component
4. What is JSX?
JavaScript syntax extension that allows writing HTML-like code in React components.
Example: <div>Hello {name}</div>
Example: <div>Hello {name}</div>
5. What are Hooks in React?
Special functions that let you use state and lifecycle features in functional components.
Examples: useState, useEffect, useContext, useRef
Examples: useState, useEffect, useContext, useRef
6. What does useEffect do?
Performs side effects (e.g., data fetching, subscriptions).
It runs after render, and can clean up if you return a function.
It runs after render, and can clean up if you return a function.
7. What is the difference between controlled and uncontrolled components?
-
Controlled: React handles input state
-
Uncontrolled: DOM handles state via refs
8. How do you lift state up in React?
Move shared state to the nearest common ancestor and pass it via props.
9. What is context in React?
A way to pass data through the component tree without using props manually at every level.
const MyContext = React.createContext()
10. What is the purpose of keys in React lists?
Helps React identify which items have changed.
Keys should be stable and unique (e.g., id).
Keys should be stable and unique (e.g., id).
11. What is reconciliation in React?
The process React uses to update the DOM by comparing the virtual DOM trees.
12. What are higher-order components (HOC)?
Functions that take a component and return a new enhanced component.
Used for code reuse.
Used for code reuse.
13. What is a custom hook?
Your own function that uses built-in hooks to encapsulate logic across components.
14. How does useMemo() differ from useCallback()?
- useMemo: memoizes a value
- useCallback: memoizes a function
15. What is React Strict Mode?
A development tool that detects potential problems like unsafe lifecycle usage or legacy API usage.
16. What is lazy loading in React?
Load components or routes only when needed using React.lazy() and Suspense.
17. What is the difference between useEffect() and useLayoutEffect()?
- useEffect: runs after paint
- useLayoutEffect: runs before paint — can block visual updates
18. What is React Fiber?
React's reconciliation engine that enables incremental rendering and better scheduling.
19. What is useReducer() and when to use it?
Hook for complex state logic. Alternative to useState when state depends on previous state or has many transitions.
20. How does React handle forms?
Through controlled components using value and onChange or uncontrolled components with refs.
📘 Want to Master React Interviews?
These 20 questions are just the beginning.
✅ Includes:
- 100+ real interview questions
- Behavioral prep + whiteboard challenges
- Updated for Hooks, Context, Router, and modern React
Find more interviewing ebooks on interviewbible.com
Tags: #reactjs #reactjsjobs #reactjsbook
OPEN TO HIRE
Nezir Zahirovic
Ruby On Rails Full stack last 10 years.
C#, ASP.NET, JavaScript, SQL, CSS, Bootstrap 11 years.
C#, ASP.NET, JavaScript, SQL, CSS, Bootstrap 11 years.
Top articles
⚛️ Top 20 React JS Interview Questions and Answers for 2025 >>>
🐍 Top 20 Python Interview Questions and Answers for 2025 >>>
🔴 Top 20 Ruby on Rails Interview Questions and Answers fo... >>>
🧠 Top 20 JavaScript Interview Questions and Answers for 2025 >>>
What's the Fucking Clean Code??? >>>
