React Interview Questions

What is react?

React is an open-source JavaScript library, not a full-blown framework, and was created by Facebook. Instead of being a full MVC (like Angular) – it is only view – built with components. These components parse up the entire UI into small and reusable pieces. Then it renders each of these components independently without affecting the rest of the UI. Since React renders each UI component only as needed there are fast performance speeds.

What are some of the features of react?

It uses the virtual DOM instead of the real DOM, it does server-side rendering, and it does uni-directional data flow or data binding. It can increase an applications performance and can be integrated with other web frameworks.

What's the difference between the real DOM and the virtual DOM?

React makes a virtual copy of the DOM to determine what parts of the actual DOM need to change based on a user’s actions. It then grabs the change date from the Virtual DOM and selectively updates the actual DOM (instead of reloading reloading the entire thing). Since this prevents constant page reloading, it create signification performance improvements.

Real DOM

  • It updates slow.
  • Can directly update HTML.
  • Creates a new DOM if element updates.
  • DOM manipulation is very expensive.
  • Too much of memory wastage.

Virtual DOM

  • Updates Faster
  • Can’t directly update the HTML
  • Update the JSX if the element updates
  • DOM Manipulation is very easy
  • No Memory Waste

What is JSX?

JSX is a shorthand for JavaScript XML. React utilizes the expressiveness of JavaScript along with HTML like template syntax.

Browsers can only read JavaScript objects but JSX in not like a regular JavaScript object, so to allow a browser to read JSX, we need to transform JSX file into a regular JavaScript object using JSX transformers like Babel or Webpack.

You don’t need to use JSX to buld websites with React, though it is a helpful tool.

What does render() do in React?

It returns a single React element which is the representation of the native DOM component, it can also return a group of elements if they are nested within one html element.

Class Components vs Functional Components?

Functional components are a basic React component, defined by the components unchanging props (properties). Class components are the more complex components. Class Components allow you to execute component lifecycle methods as well as manage a component’s state.

What are Arrow Functions in React?

Arrow functions => are a syntax for function expressions and are one of the ways to pass parameters to callback functions. Using an arrow function creates a new function each time the component renders.

What's the difference between ES5 and ES6?

ECMAScript 6 was the second major revision to JavaScript and is also known as ES6 and ECMAScript 2015. ES5 was released in 2009. Some of the big differences are with require vs import, how to export, and components

What is Props in React?

Props (short for Properties) are read only components that are passed down from parent to child (maintaining the uni-directional data flow). They are immutable and mostly used to render dynamically created of gotten data – they describe the way a React component is configured.

Properties are set when instantiating the component, and they shouldn’t be mutated afterwards. Mutating values within a component are tracked with the state property rather than the props property.

What is State in React?

State is used to create dynamic and responsive components and can be accessed with this.state(). State is facilitated with event handlers on DOM elements that notify the component of the new state with the updated values retrieved from the DOM (like when a user types in an input box for example). The state of a component can be updated with this.setState().

What is React Router?

React Router is a routing library built on top of React that keeps the URL in sync with data that’s currently being displayed on the web page while maintaining a standardized structure. It is used for developing single page web applications. Unlike for conventional routing only the history attribute is change instead of having a HTTP request sent to a server.

No Comment.