Content provider: Jinniu District Wudi Software Development Studio
I am one of the developers of React. I have been writing React for quite some time. During the interview, I came across many things THAT I didn’t understand. I hope this article can help you.
React
- React features differ from key releases.
1. React’s this.setstate () method 2. React’s this.setstate () method 3. Why is this.setState asynchronous? Answer: blog.csdn.net/weixin_4360… 4. What is the React ref? How do I create a ref? React function components and class components create ref and common scenarios. What do you know about the React lifecycle? What are they used for? 6. What algorithm does React use? Do you know this algorithm? 7. React Fiber algorithm How to improve the performance of the React framework? 8. React creates components in several ways. 9. What UI frameworks did you use when developing React and explain their design philosophy? 10. Tell us about the React component. 11. Do you know JSX? Please tell me briefly. 12. What plugins did you use for the React project? 13. How do React parent components pass parameters? 14. Do you know the React virtual DOM? Why does the virtual DOM improve performance? 15. What is the React lifecycle when refreshing a page using F5? 16. Have you ever used Redux? Tell me about Redux. 17. React-router 18. Do you know about react-hook? 19. React Hooks Have the advantages/disadvantages of high order components and Class components. What do you know about redirecting routes? 21. In webpack, use loader to convert JSX code or Babel. Answer: Preset -react 22. What happens after setState is called? Answer: There are two cases:
- React update policy has been enabled (event triggered) :
Perform => setState => Obtain the internal instance => store the new state => Discover that the update policy transaction has been started => Insert the current internal instance into the dirty Component array => SetState End => Update policy transaction Perform end => Wrapper process component state update
- React update policy is not enabled (asynchronously triggered) :
SetState => Get internal instance => Store new state => Find update policy transaction not started => Start update policy transaction (bound with wrapper) => transaction Perform => Put current internal instance into dirty component array => Update policy transaction Perform complete => 23. SetState is asynchronous. When did you have a pit at this point? For example, if you use setState to change the state, but if you print the state value after this method, you will find that the state is the same as before. Only the second parameter callback can print the changed state. Also, when setState is called multiple times, the same ones are merged into one, and the latter one overwrites the previous one. It collects a batch of components that need to be updated and updates them together. 24. What is the role of Refs and in what business scenarios have you used refs? Use ref to create a custom style for uploading images. Use ref to create a custom style for uploading photos. Refs is a great way to send messages to specific sub-instances (streaming Reactive props and State is inconvenient).
Note: Refs cannot connect to a stateless function because these components do not have supported instances. You can always wrap a stateless component in a standard composite and wire a ref to the composite.
- How can useEffect be updated when props changes but not triggered when initialized?
Answer: [pseudocode]
import React,{useEffect, useRef} from 'react'
function Test(props) {
const refs = useRef(0);
useEffect(() = > {
console.log('mount')
}, [])
useEffect(() = > {
if (refs.current++) {
console.log('update')
}
}, [props.param])
/* * * */
}
Copy the code- Ref is a function. What’s good about it?
React is a more elegant way of retrieving variables when a component is being destroyed. This. Test can be easily cleared to null when a component is being destroyed. Another benefit: ref is a callback function, which allows us to do more in this function. For example, we can use this function mechanism to let the parent component directly obtain the Dom of the child component. If you make ref a string, it’s impossible to do that. 27. What does useImperativeHandle do? The answer:React.docschina.org/docs/hooks-…28. What do you think of higher-order components, and what is it essentially? Does React use inheritance or higher-order components? 30. What are the disadvantages of higher-order components? 31. What is the difference between controlled and uncontrolled components? 32. When are controlled components and uncontrolled components suitable for use? The answer:
The interview questions continue to update, welcome friends to contribute ~ contribute friends please leave their own QQ or Wechat in the comments below, I add you