React Interview Questions Flashcards
What is React?
language & type, who developed it, what approach, what’s it used for, popularity
a. Front end java script library
b. Developed by Facebook in 2011
c. Follows component-based approach which helps in building reusable UI components.
d. It is used for developing complex and interactive web and mobile UI.
e. Has one of the largest communities supporting it.
What are 3 features of React?
a. It uses the virtual DOM instead of the real DOM.
b. It uses server-side rendering.
c. It follows uni-directional data flow or data binding.
List some of the major advantages of React?
a. Increased application performance
b. It can be used both client and server side.
c. Because of JSX, code’s readability increases.
d. React is easy to integrate with other frameworks like Meteor, Angular, etc
e. Using React, writing UI test cases become extremely easy.
What are the limitations of React?
a. React is just a library, not a full-blown framework.
b. Its library is very large and takes time to understand.
c. It can be a little difficult for novice programmers to understand.
d. Coding gets complex as it uses inline templating and JSX.
What is JSX?
a. Stands for JavaScript XML
b. Syntax extension for JavaScript based in ES6.
c. Allows you to write HTML in React by converting HTML into React components
d. JSX is syntactic sugar.
e. This makes the HTML file easy to understand.
f. This makes application robust and boosts performance.
What is the difference between the DOM and the Virtual DOM?
a. Virtual DOM updates faster
b. DOM manipulation is very easy.
c. No memory wastage
d. Can’t directly update HTML.
e. Updates the JSX if element updates instead of rendering a whole new DOM.
What do you understand by Virtual DOM? Explain its working.
a. A virtual DOM is a lightweight javaScript object which originally is just the copy of the real DOM. It is a node tree that lists the elements, their attributes and content as Objects and their properties. React’s render function creates a node tree out of the React components. It then updates this tree in response to the mutation in the data model which is caused by various actions done by the user or by the system.
b. The Virtual DOM works in three simple steps
i. Whenever any underlying data changes, the entire UI is re-rendered in Virtual DOM representation.
ii. Then the difference between the previous DOM representation and the new one is calculated
iii. Once the calculation are done, the real DOM is updated with only the things that have actually changed.
Why can’t browsers read JSX?
a. Browsers can only read JavaScript objects but JSX is not a regular JavaScript object. This to enable a browser to read JSX, first, we need to transform JSX file into a JavaScript object using JSX transformers like Babel and then pass it to the browser.
How is React different from Angular?
architecture, rendering, DOM, data binding, debugging, author
a. Architecture – React (Only the View of MVC), Angular (Complete MVC)
b. Rendering- React (Server-side rendering), Angular (Client-side rendering)
c. DOM – React (Uses virtual DOM), Angular (Uses real DOM)
d. Data Binding – React (One-way data binding), Angular (Two-way data binding)
e. Debugging – React (Compile time debugging), Angular (Runtime debugging)
f. Author – React (Facebook), Angular (Google)
“In React, everything is a component” Explain.
a. Components are the building blocks of a React applications UI. These components split up the entire UI into small independent and reusable pieces. Then it render each of these components independent of each other without affecting the rest of the UI.
What is the purpose of render() in React?
a. Each React component must have a render() mandatorily. It returns a single React element which is the representation of the native DOM component. If more than one HTML element needs to be rendered, then they must be grouped together inside one enclosing tag such as , , <div> etc. This function must be kept pure i.e, it must return the same result each time it is invoked. </div>
