React Flashcards
What’s the virtual DOM?
Virtual Dom is an in memory representation of the actual html elements . When a component is rendered, the virtual DOm compares the change to its model of the DOM in order to create a list of updates to applied.
What is JSX ?
JSX is an extension to Javascript syntax that allows for writing code that looks like HTML.
What’s the difference between a class component and a functional one?
Class-based components were used to create components that needed to maintain internal state or utilize lifecycle methods.
Functional components are stateless and return the output to be rendered.
What are keys used for?
Keys help React identify which items have changed, are added, or are removed.
- What’s the difference between state and props?
Props are data that are passed into a component from its parent. (should be read-only, when declare function/class, it never modify its props);
Sate is a component’s internal data that can be modified during the lifetime of the components and it’s maintained between re-renders.
Why call setState instead of directly mutating state?
If you try to mutate a component’s state directly, React has no way of knowing that it needs to re-render the component. By using setState, React can update components UI
Why call setState instead of directly mutating state?
If you try to mutate a component’s state directly, React has no way of knowing that it needs to re-render the component. By using setState, React can update components UI
What’s prop drilling, and how can you avoid it?
Props drilling is when you need to pass to data from a parent component down to a component lower in the hierarchy, drilling through other components that have no need for the props themselves.
Avoid: refractoring components, keep common state in the closest common parent. If deep down, considere react context api, redux
What’s React context?
Context provides a way to pass data through the component tree without having to pass props down manually at every level.
(implicit prop)
Redux
A state management library that introduces before context api
Advantage of React
easy to learn and use
virtual dom to improve efficiency
easier to create dynamic web page
MVC architeture
Limitation of React
The speed of development is so fast that the documentation cant keep up
Complexity of learning
jsx can be a barrier
React
a javascript library which is used to built user interfaces especially single-page application
Major features of React
use virtual dom instead of realdom
support server-side rendering
Follows Unidirectional data flow or data binding.(round: state => views => action)
use reusable/composable UI rendering
React Hooks
Hooks is a new feature(React 16.8) that lets you use state and other React features without writing a class.