React Questions

export default function MyComponent(props = { name: 'John' }) { }

defaultProps = { name: 'John' }(MyComponent);

MyComponent.defaultProps = { name: 'John' };

function MyComponent(props) { props.defaultProps = { name: 'John' }; }

By directly manipulating the DOM to insert error messages.

By relying solely on browser console logs for error reporting.

By conditionally rendering error messages based on validation results.

By using a third-party library specifically for error display.

constructor()

componentWillUnmount()

componentDidMount()

componentDidUpdate()

Using events

Using props

Using state

Using refs

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

There is no difference, they are the same.

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

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

Functional components cannot receive props, while class components can

Functional components are stateless, while class components can have state

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

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

let Welcome = (props) => { ... }

class Welcome extends React.Component { ... }

function Welcome(props) { ... }

const Welcome = () => { ... };

When you prefer a more imperative approach and direct DOM manipulation.

When dealing with a large, complex form where performance optimization is critical.

When you need real-time validation and immediate feedback to the user.

When integrating with a third-party library that requires direct access to form elements.

The state will be updated, but the component won't re-render

An error will be thrown

The component will re-render automatically

The application will crash

Defining separate event handler methods within the component

Using the addEventListener method like in vanilla JavaScript

Using inline event handlers like onClick={handleClick}

React components don't handle events directly; you must use a library.