React Questions

JSX attributes are used for styling, while HTML attributes are for functionality.

There is no difference, they are the same.

JSX attributes can only be strings, while HTML attributes can be any data type.

JSX attributes are written in camelCase, while HTML attributes are lowercase.

Arguments passed to a component

Functions to update the UI

Lifecycle methods of a component

Internal data of a component

There is no difference; both are interchangeable.

Functional components are used for complex UI, while class components are used for simple UI.

Class components can have state and lifecycle methods, while functional components cannot.

Functional components are written in JavaScript, while class components are written in JSX.

The component will re-render, and the state change will be reflected correctly.

An error will be thrown, and the application will crash.

Nothing will happen; the state will remain unchanged.

The component will re-render, but the state change won't be reflected.

The component will not render

The prop will be undefined

An error is thrown

The default prop value is used

DOM manipulation is slow and inefficient in modern browsers

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

React's event system automatically prevents DOM manipulation

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

As a property of the event object (e.g., event.target)

By passing the element as an argument to the event handler

Using this keyword inside the event handler

React doesn't provide a way to access the triggering element

Events are not handled in functional components, only in class components

By creating separate event listener functions outside the component

By defining methods inside the component class

Using inline event handlers directly in JSX

Both 'Using bind in the constructor' and 'Using arrow functions in the render method'

Using bind in the constructor

Calling addEventListener within the componentDidMount lifecycle method

Using arrow functions in the render method