DEV Community

Supriya
Supriya

Posted on

React Blog

[1. PropTypes?
Answer: PropTypes are a mechanism to ensure that components use the correct data type and pass the right data, and that components use the right type of props, and that receiving components receive the right type of props.

  1. What are State-props?
    Answer: Props are used to pass data, whereas state is for managing data. ... State data can be modified by its own component, but is private (cannot be accessed from outside) Props can only be passed from parent component to child.
    Props are external and controlled by whatever renders the component. The State is internal and controlled by the React Component itself.

  2. What is JSX?
    Answer: JSX stands for JavaScript XML. It is simply a syntax extension of JavaScript. It allows us to directly write HTML in React (within JavaScript code). It is easy to create a template using JSX in React, but it is not a simple template language instead it comes with the full power of JavaScript.

  3. Explain Component Lifecycle?
    Answer: Components are created (mounted on the DOM), grow by updating, and then die (unmount on DOM). This is referred to as a component lifecycle.

Every React Component has a lifecycle of its own, lifecycle of a component can be defined as the series of methods that are invoked in different stages of the component's existence. Mounting: Mounting is the stage of rendering the JSX returned by the render method itself.

Image description

        Figure: Components Lifecycle
Enter fullscreen mode Exit fullscreen mode

  1. Hooks?
    Answer: Hooks are the new feature introduced in the React 16.8 version. It allows you to use state and other React features without writing a class. Hooks are the functions which "hook into" React state and lifecycle features from function components. Also, it does not replace your knowledge of React concepts.

  2. What are custom hooks?
    Answer: Custom Hooks are a mechanism to reuse stateful logic (such as setting up a subscription and remembering the current value), but every time you use a custom Hook, all state and effects inside of it are fully isolated. How does a custom Hook get isolated state? Each call to a Hook gets isolated state.

  3. Explain context API?
    Answer: The React Context API is a way for a React app to effectively produce global variables that can be passed around. This is the alternative to "prop drilling" or moving props from grandparent to child to parent, and so on.
    According to the React docs, Context provides a way to pass data through the component tree from parent to child components, without having to pass props down manually at each level. Each component in Context is context-aware.

  4. Virtual DOM and diffing- algorithm?
    Answer:
    Virtual DOM: The virtual DOM (VDOM) is a programming concept where an ideal, or “virtual”, representation of a UI is kept in memory and synced with the “real” DOM by a library such as ReactDOM. Since “virtual DOM” is more of a pattern than a specific technology, people sometimes say it to mean different things.

Diffing-algorithm: A diff algorithm outputs the set of differences between two inputs. These algorithms are the basis of a number of commonly used developer tools.Git is one example where a developer can read, commit, pull, and merge diffs without ever understanding the underlying diff algorithm.
](https://docs.google.com/document/d/1_3Md2NXxJKu60kRyEinK93VXpkoGKWWoWcYEdrwBVD4/edit?usp=sharing)

Top comments (0)