What are inline conditional expressions?
- Expressions that are evaluated during compilation
- Expressions that are evaluated during runtime
- Expressions that are used to conditionally render components
- Expressions that are used to set component state
Inline conditional expressions in React are expressions that are used to conditionally render components based on a certain condition. They are typically used in JSX, and are written using the ternary operator. Inline conditional expressions are a simple and effective way to conditionally render components without the need for additional logic.
Why is a component constructor called only once?
- The constructor is called for each new instance of the component
- The constructor is not needed in functional components
- The constructor is not used in React components
- The constructor is only called when the component is first created
In React, the constructor is called only once when the component is first created. This is because the constructor is used to initialize the component state and bind event handlers, and these operations only need to be performed once. After the component has been created, subsequent updates will use the "componentDidUpdate()" method to update the state and re-render the component.
What is the stable release for hooks support?
- React 15
- React 16
- React 17
React Hooks were first introduced in React 16.8, and have been a stable feature of React since React 16.8.0. React 17 is the most recent stable release of React as of September 2021.
What is the benefit of styles modules?
- Styles modules allow for dynamic styling with props
- Styles modules allow you to use CSS with React components
- Styles modules are required for server-side rendering
- Styles modules prevent CSS class naming collisions
Styles modules in React allow you to avoid CSS class naming collisions by generating unique class names at runtime. This helps prevent conflicts with other styles in the project, and allows you to use descriptive class names without worrying about naming conventions.
How to create React class components without ES6?
- By using create-react-class method
- By using functional components
- By using the React.Component class directly
The create-react-class method is a way to create React class components without using ES6 syntax. This method allows components to be created using a simple object-based syntax, rather than defining a class and extending the React.Component class. The create-react-class method is useful for creating components that do not require complex logic or state management.
What is the purpose of registerServiceWorker in React?
- To register a new service worker with the browser
- To enable client-side caching of static assets
- To enable offline access to the application
- All of the above
registerServiceWorker is a utility function provided by the Create React App tool that registers a new service worker with the browser. This service worker enables client-side caching of static assets and enables offline access to the application.
What are the lifecycle methods going to be deprecated in React v16?
- componentWillMount and componentWillReceiveProps
- componentWillMount and componentWillUpdate
- componentWillReceiveProps and componentWillUpdate
- componentWillUpdate and componentDidUpdate
The "componentWillReceiveProps" and "componentWillUpdate" lifecycle methods are going to be deprecated in React v16. These methods will be replaced with new lifecycle methods that are more efficient and easier to reason about. The new methods are "getDerivedStateFromProps" and "getSnapshotBeforeUpdate".
How to get history on React Router v4?
- Use the "history" object provided by the "history" module
- Use the "history" object provided by the "react-router-dom" module
- Use the "this.history" object provided by the router
- Use the "this.props.history" object passed to the component
In React Router v4, you can get the history object by using the "this.props.history" object passed to the component. This object contains the current history of the router, including the current location, previous locations, and navigation history. You can use this object to programmatically navigate, access the current URL, or manage the browser history.
How to dispatch an action on load?
- Use a lifecycle method in a component
- Use a middleware
- Dispatch the action in the reducer
To dispatch an action on load, you can use a lifecycle method in a React component, such as componentDidMount(). This method is called once the component has mounted, allowing you to dispatch an action to the Redux store.
What is the difference between Flow and PropTypes?
- Flow is a type checking tool for JavaScript, while PropTypes is a runtime type checking library
- Flow and PropTypes are the same thing
- PropTypes is a type checking tool for JavaScript, while Flow is a runtime type checking library
- PropTypes is a runtime validation library for React components
The main difference between Flow and PropTypes is that Flow is a type checking tool for JavaScript that checks types at compile-time, while PropTypes is a runtime type checking library for React components that checks types at runtime. Flow is particularly useful in large codebases where it can be difficult to keep track of all the variables and function calls, while PropTypes is useful for catching errors in React components at runtime.