React Basics
1 Comparison between the virtual DOM and the real DOM
The real DOM is slow to update, and the HTML is updated directly. Creating a new DOM is expensive. The DOM operation consumes a lot of memory
2 What is React
React is a JS library developed by Face in 2011. It follows the component approach and develops complex Web interfaces. It was opened in 2015, but has a strong community and plug-in support
3 Features of React
- A uses the virtual DOM
- B can render next server
- C Single data flow and data binding
4 Advantages of React
- Fast rendering with local updates through the virtual DOM
- It’s compatible across browsers through the virtual DOM and has great API support. Ie8 is also compatible
- Modularity improves reusability by being able to write separate UI components when writing code
- Unidirectional data flow
- Good flexibility, more close to the JS writing method
5 Difference between React and VUE
- React allows you to register all vue components globally or locally. React allows you to import components locally
- React uses only JSX syntax
- Vue has calculation and listening properties while React has to use its own set of logic
- React uses JAVASCRIPT, CSS and HTML in a single file, which makes it more flexible
- Vue Bidirectional data flow V-Module Bidirectional data binding The parent component passes data updates through the props child component view React It is not recommended that the props update data on the view react single data flow. Data on the view can only be updated by triggering an event and then passing the SETState update
6 What is JSX
JSX stands for javascript and XML means you can write XML in JS to make it easier to control the DOM
What are the virtual DOM and diff algorithms
A virtual DOM is a JS object that is a copy of the real DOM and the properties of the DOM become the properties of the object, and when one of those properties changes the whole UI is rerendered and then the dom difference is calculated and then the real DOM is updated
8 Why cannot the Browser read JSX
Browsers can only read objects in JS, not JSX and can only convert them to JS objects through converters like babal
9 What is the difference between ES5 and ES6
- Replace require import with import import
- Modeule Exports and Export Defult
- Class class inheritance
- The state of different
- Different props
React component knowledge
1 Functions of the React component
React application building blocks these components are separated into separate reusable parts and each component is separated into a separate module independent of each other and it doesn’t affect the other components stateful components and stateless components. Stateless components are mostly UI components that don’t have any logic, don’t have any data state, they’re function components, right
React render function
In React, each component must have a render function that returns a react element value within a closed tag
What is 3 props
The props/React property must be kept pure and immutable. The one-way data flow from parent to child components is used to generate data dynamically
4 What is the React state
The React state is the core of the component and is the source of the data. The state is the object that the component presents and acts on. Unlike props, it is mutable and creates dynamic interaction components that are accessed through this.state
5 Distinguish between props and status
| conditions | state | props |
|---|---|---|
| The parent component accepts the initial value | is | is |
| The parent component can change the value | no | is |
| Component Settings default values | is | is |
| Internal changes to the parent component | is | no |
| Sets the initial values of the child components | is | is |
| Changes within child components | no | is |