Why is it generally not recommended to mutate the DOM directly in React?
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
React doesn't have access to the DOM, so manipulation is impossible
What does JSX ultimately get transpiled into?
HTML
JSON
Plain JavaScript
CSS
What is the typical approach for handling form submission in React?
Using the browser's default form submission mechanism.
Using a third-party library to handle all form-related tasks.
Preventing default behavior and handling submission logic within an event handler.
Submitting the form using AJAX without any event handling.
What is the primary characteristic of a controlled component in React?
It directly manipulates the DOM to update form values.
It uses external libraries for form handling.
It maintains its own internal state for form data.
It relies on the browser to manage form data.
How can you access the original DOM event object in a React event handler?
React doesn't provide access to the original DOM event; it's completely abstracted.
Through the nativeEvent property of the synthetic event object
nativeEvent
By using a ref to the DOM element and accessing its event listeners
By directly using event.target or event.currentTarget
event.target
event.currentTarget
What is the second argument of the useEffect Hook used for?
useEffect
It provides access to the previous state and props.
It defines the effect to be executed.
It specifies a list of dependencies that trigger the effect when they change.
It indicates the effect should be executed only once, like componentDidMount.
componentDidMount
How do you define default props for a functional component in React?
Inside the component's function body
By passing them as arguments to the component
Using the defaultProps property of the component function
defaultProps
Default props are not supported for functional components
What's a common way to bind event handlers in React class components?
Using arrow functions in the render method
render
Calling addEventListener within the componentDidMount lifecycle method
addEventListener
Using bind in the constructor
bind
Both 'Using bind in the constructor' and 'Using arrow functions in the render method'
What is the purpose of event.preventDefault() in React event handling?
event.preventDefault()
To stop the event from bubbling up the component tree
To prevent the default behavior of the event (like form submission)
To detach the event handler after it has been executed once
To cancel the event entirely and prevent any further actions
What is the purpose of PropTypes in React?
To style components
To enforce the data type of props
To handle user events
To manage component state