Interview Questions
React.js is a JavaScript library developed by Facebook for building user interfaces, especially single-page applications (SPAs). It allows developers to create reusable UI components, manage application state, and efficiently update and render the right components in response to data changes.
JSX: A syntax extension that allows writing HTML elements in JavaScript.
Virtual DOM: A lightweight representation of the real DOM that enables efficient updates and rendering.
Component-Based Architecture: Building UIs as a collection of reusable, self-contained components.
Unidirectional Data Flow: Data flows in one direction, making it easier to track changes and debug.
JSX stands for JavaScript XML. It is a syntax extension for JavaScript that allows writing HTML elements directly within JavaScript. JSX makes code easier to understand and maintain by providing a syntax that closely resembles HTML.
The Virtual DOM is an in-memory representation of the real DOM elements. When the state of a component changes, React updates the Virtual DOM first. It then calculates the minimal number of changes needed to update the real DOM. This process, called "reconciliation," improves performance by minimizing direct manipulations of the DOM.
Components are the building blocks of a React application. They are self-contained, reusable code units that represent a part of the user interface. Components can be classified into two types:
Functional Components: Simple functions that receive props and return JSX.
Class Components: ES6 classes that extend React.Component and can manage their own state and lifecycle methods.
State: A component's state is an object that holds information that influences the output of the component. State is managed within the component and can change over time.
Props: Props (short for "properties") are read-only data passed from a parent component to a child component. Props allow data to be passed between components and cannot be modified by the receiving component.
The useEffect hook allows you to perform side effects in functional components, such as fetching data, subscribing to services, or manually updating the DOM. It takes two arguments: a callback function and an optional dependency array. The callback function runs after the render, and the dependency array determines when the effect should re-run.
Forms in React can be controlled or uncontrolled. In a controlled component, the form element's value is managed by React state, and any changes are handled via an event handler.
The Context API provides a way to pass data through the component tree without manually passing props at every level. It is useful for global state management, such as user authentication, theming, or settings.
React Fiber is the reimplementation of React's core algorithm for rendering. It is the foundation for async rendering and prioritizes updates based on their urgency. Fiber improves rendering performance and allows React to pause and resume work, split tasks into chunks, and reuse resources efficiently.
