React Interview Questions and Answers
What is React?
React is a JavaScript library used to build user interfaces, especially single-page applications. It allows developers to create reusable UI components.
What are the main features of React?
Key features include component-based architecture, virtual DOM, unidirectional data flow, and support for hooks.
What is JSX?
JSX is a syntax extension for JavaScript that allows writing HTML-like code inside JavaScript. It makes UI code easier to read and write.
What is the Virtual DOM?
The Virtual DOM is a lightweight copy of the real DOM. React updates the Virtual DOM first and then efficiently updates only the changed parts in the real DOM.
What are components in React?
Components are reusable, independent pieces of UI. They can be functional or class-based and accept inputs called props.
What is the difference between functional and class components?
Functional components are simple JavaScript functions and can use hooks. Class components use ES6 classes and lifecycle methods.
What are props?
Props are read-only inputs passed from a parent component to a child component. They help make components reusable.
What is state in React?
State is a built-in object used to store data that affects how a component renders and behaves. State can change over time.
What is the difference between state and props?
Props are passed from parent to child and are immutable, while state is managed within the component and can be updated.
What is useState hook?
useState is a React hook that allows functional components to manage state.
What is useEffect hook?
useEffect is a hook used to perform side effects such as data fetching, subscriptions, or DOM updates.
When does useEffect run?
By default, useEffect runs after every render. It can be controlled using a dependency array.
What is lifting state up?
Lifting state up means moving shared state to the closest common parent component so multiple components can access it.
What are controlled components?
Controlled components are form elements whose values are controlled by React state.
What is conditional rendering?
Conditional rendering means rendering components or elements based on certain conditions using if statements or ternary operators.
What is key prop and why is it important?
The key prop helps React identify which items have changed in a list. It improves performance and prevents rendering issues.
What is React Fragment?
React Fragment allows grouping multiple elements without adding extra nodes to the DOM.
What is context API?
Context API provides a way to pass data through the component tree without manually passing props at every level.
What is memoization in React?
Memoization is an optimization technique used to prevent unnecessary re-renders using React.memo, useMemo, or useCallback.
What are hooks?
Hooks are functions that let you use React features like state and lifecycle methods in functional components.