ReactJS most popular interview questions & answers 2022
1. What is React?
It is an open source project released in 2013 by Meta, for building user interfaces (UI). It is based on declarative programming principles, and using components as main entities.
2. What is JSX?
3. Why can’t browsers read JSX?
4. What is Redux?
5. How is React different from Angular?
6. What are props in React?
7. What is a state in React?
It is part of a component which contains data or information about it. It can be changed dynamically and every change will cause component re-render. States can store properties but are available to use only in class components.
8. What is an event in React?
React has its own alternatives for DOM events. They mean and do the same as the original but their syntax uses the camel case instead lower case in DOM. One important difference is that in React we pass as an event handler a function instead of a string in DOM.
9. How to write comments in React?
10. What are the components in React?
11. Does React use HTML?
React doesn’t use clear HTML but supports most of its functions and syntax, which must be realized via JSX.
12. What’s the difference between Real DOM and Virtual DOM?
Real DOM is the object of a document with all content and dependencies. In React for each Real DOM is available Virtual DOM, which realizes its light-weight copy as it doesn’t take a part in drawing documents. So it’s faster to call and edit Virtual DOM then edit Real DOM while viewing it on the screen.
13. What are Synthetic events in React?
These are the events which are cross-browser and used to initiate events in browsers according to DOM. As some events which realize the same action, may have different names in different browsers, React allows to create events which will be versatile for all browsers. These events are called Synthetic events. Examples of Synthetic events: onClick, onChange etc.
14. What is the use of render() in React?
The ReactDOM.render() is the function which accepts HTML code and HTML element as arguments. After execution it creates code which shows how the received HTML code will look in the HTML element and save it in the separated HTML file located in the “public” folder of the React project.
15. How is React different from React Native?
16. What are the refs in React?
It is a React function which provides access to DOM nodes and React elements. They allow directly changing child objects or their values without using props. They are created by React.createRef() function and compatible with DOM nodes and class components only.
17. What is an arrow function and how is it used in React?
This is a function with shorter than simple callback syntax and declared with “=>“sign. In React handling “this” with an arrow function will always call an object represented by the function. It is useful in some cases as in callback “this” can represent a document, function and other entities.
18. How to update the state of a component in React?
By scheduling and updating a component’s state with setState() inside the function.
19. What’s the difference between states and props in ReactJS?
They both can store data, but only states can accept changes in data and contain the opponent – props. Properties can be used in functional components that are unavailable for states. States updates directly, while props by parent component.
20. What are the drawbacks of React?
This is a very large library with fast-changeable, and as a result difficult documentation. Instead of this, this library requires a lot of additional knowledge for normal integration of React in the development process. Also some developers think that JSX is also disadvantageous as it is very specific in using.
21. What are the Advantages of React JS?
React is optimized for fast website rendering and well configured for SEO, both these facts are big advantages as it improves search indexations. Despite this using components as a key and reusable entities together with their declarative changing their data makes it very easy to use.
22. What is Flux Concept In React?
It is a kind of application architecture which realizes unidirectional data exchange inside the app. In the center of this concept is the Dispatcher component which transfers data received by Actions to Stores. Here Actions play roles as Events while Stores – store and/or change data and send it to Views (visible UI components).
23. What is Jest?
24. What is a dispatcher?
It is one of the components required for building apps according to Flux architecture. In this pattern dispatcher is the main point which manages data exchanging inside the app.
25. What is the higher-order component?
It is a function which takes a component and data as arguments and returns a new enhanced component. This pattern is available due to React compositional nature.