React Questions

React's event system automatically prevents DOM manipulation

React doesn't have access to the DOM, so manipulation is impossible

DOM manipulation is slow and inefficient in modern browsers

Direct DOM manipulation can lead to inconsistencies between the actual DOM and React's virtual DOM

Simplified state management with reduced boilerplate code.

Enhanced control over form data and validation.

Direct manipulation of the DOM for improved performance.

Seamless integration with external libraries for form handling.

To perform any necessary cleanup operations before a component is removed from the DOM.

To render the component for the first time.

To update the state based on changes in props.

To handle user interactions like button clicks.

Define event handlers as inline arrow functions within the render method

Define event handlers as separate methods within the class and bind them in the constructor

Use global event listeners to manage events outside the component

Event handling is not typically done within React class components

{{ expression }}

( expression )

{ expression }

expression

Component rehydration

State reconciliation

Lifecycle management

Virtual DOM diffing

componentWillUnmount()

constructor()

componentDidMount()

componentDidUpdate()

Functional components cannot receive props, while class components can

Functional components are stateless, while class components can have state

Functional components are written in JavaScript, while class components use TypeScript

Functional components are used for complex UI logic, while class components are for simple elements

Using props

Using refs

Using state

Using events

useEffect is only used for data fetching.

There is no relationship between useEffect and lifecycle methods.

useEffect combines the functionality of componentDidMount, componentDidUpdate, and componentWillUnmount.

useEffect is a replacement for componentDidMount only.