What is the proper placement for error boundaries?

  • They should be placed at the top level of the component tree
  • They should be placed in every component that renders other components
  • They should be placed in the root element of the application
  • They can be placed anywhere in the component tree
Error boundaries in React should be placed at the top level of the component tree, as close to the root of the application as possible. This ensures that errors are caught and handled as early as possible in the rendering process, and prevents them from affecting other components or causing cascading errors.

How do you say that state updates are merged?

  • By using setState()
  • By using forceUpdate()
  • By using Object.assign()
  • By using the spread operator
In React, state updates are merged with the existing state using the spread operator. When setState() is called, React updates the state object by merging the new state object with the existing state object. This allows components to update specific properties of the state object without overwriting the entire object.

What is the typical use case of portals?

  • For rendering large lists
  • For creating modals and tooltips
  • For building layouts and grids
  • For handling state in complex components
Portals in React are a way to render a child component outside of its parent component. This is useful in cases where you need to render a child component in a different part of the DOM hierarchy, such as when creating modals or tooltips.

What is the methods order when component re-rendered?

  • constructor(), render(), componentDidMount()
  • render(), componentDidUpdate(), componentWillUnmount()
  • render(), componentDidUpdate(), componentDidMount()
  • componentDidMount(), render(), componentDidUpdate()
When a component is re-rendered in React, the order of methods that are called is as follows: render(), componentDidUpdate(), and then componentDidMount(). The render() method is called to update the component's UI based on any changes in props or state, followed by componentDidUpdate() to handle any side effects that may have occurred as a result of the update. Finally, componentDidMount() is called to perform any additional setup that may be necessary for the updated component.

How to create components in React?

  • Using React.createElement or JSX
  • Using a third-party library
  • Using jQuery
  • Using plain HTML
In React, components can be created using the React.createElement method or JSX syntax. React.createElement is a lower-level API for creating components, while JSX is a syntax extension that allows developers to write HTML-like code in JavaScript. 

Why you can't update props in React?

  • Props are immutable and cannot be changed
  • Props are read-only and should not be modified directly
  • React does not provide a method for updating props
  • Updating props can cause performance issues in React
In React, props are immutable and cannot be changed directly. This is because React is designed to be a one-way data flow, where data is passed down from parent components to child components through props. If you need to update the data, you should do so in the parent component and pass the updated data down as props to the child components.

What is React memo function?

  • A function that creates a memoized version of a component
  • A function that returns a higher-order component
  • A function that creates a new instance of a component
  • A function that creates a new element in the DOM
React memo is a higher-order function that creates a memoized version of a component. This memoized version can help improve performance by avoiding unnecessary re-renders of the component. The memo function works by caching the result of the component's render method and comparing it to the previous result. If the result is the same, the component is not re-rendered.

What is Flow?

  • A JavaScript testing framework
  • A state management library
  • A type checking tool for JavaScript
  • A styling library for React
Flow is a type checking tool for JavaScript that is commonly used in React and React Native applications. Flow allows you to add static types to your JavaScript code, which can help to catch errors at compile-time instead of at runtime. Flow is particularly useful in large codebases where it can be difficult to keep track of all the variables and function calls.

What is the difference between component and container in React Redux?

  • Components are stateful, while containers are stateless
  • Components are connected to the Redux store, while containers are not
  • Components are responsible for rendering, while containers are responsible for state management
Components and containers in React Redux have different responsibilities. Components are responsible for rendering UI elements and receive props from their parent components, while containers are connected to the Redux store and manage the application state.

What is the difference between state and props?

  • Props are internal to a component, while state is external
  • State is managed within a component, while props are passed down from a parent component
  • State is read-only, while props can be changed by the child component
  • There is no difference
The main difference between state and props in React is that state is managed within a component, while props are passed down from a parent component. State is used to manage a component's internal data, which can change over time, while props are used to customize a component's behavior and appearance.