Which of the following JSX expressions is INVALID?
<span>This is incorrect {</span>
What is the primary purpose of components in React?
To directly manipulate the DOM
To break down the UI into independent, reusable pieces
To handle user interactions
To manage application state
In JSX, how would you set the 'class' attribute for an element?
Which of the following is NOT a valid way to bind an event handler in a React class component?
Using an arrow function in the callback: onClick={() => this.handleClick()}
onClick={() => this.handleClick()}
Directly passing the method: onClick={this.handleClick}
onClick={this.handleClick}
Using addEventListener directly on the DOM element
addEventListener
Binding in the constructor: this.handleClick = this.handleClick.bind(this)
this.handleClick = this.handleClick.bind(this)
Why is it generally not recommended to mutate the DOM directly in React?
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
DOM manipulation is slow and inefficient in modern browsers
When would it be more appropriate to consider using an uncontrolled component in a React form?
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.
When you prefer a more imperative approach and direct DOM manipulation.
Which lifecycle method is called only once, after a component is rendered to the DOM for the first time?
constructor()
componentWillUnmount()
componentDidMount()
componentDidUpdate()
What is the purpose of using key prop in JSX elements within a list?
key
To define the order in which elements should be displayed.
To help React efficiently update and re-render lists.
To give each element a unique identifier for styling purposes.
To associate event handlers with specific elements.
What is the typical approach for handling form submission in React?
Submitting the form using AJAX without any event handling.
Preventing default behavior and handling submission logic within an event handler.
Using the browser's default form submission mechanism.
Using a third-party library to handle all form-related tasks.
How do class components in React typically handle events?
By defining methods on the class that act as event handlers
By relying on external state management libraries for event handling
Using inline arrow functions directly in the JSX
Class components cannot handle events; only functional components can