React
1. 受控组件和非受控组件
针对表单元素而言的。区别是表单的value值是否受组件state的控制。
受控组件：表单的value值受组件内部状态的控制。<input type='text' value={state.x} onChange={(e)=>{setState(e.target.value)}} 在HTML的表单元素中，它们通常自己维护一套state，并随着用户的输入自己进行UI上的更新，这种行为是不被我们程序所管控的。而如果将React里的state属性和表单元素的值建立依赖关系，再通过onChange事件与setState()结合更新state属性，就能达到控制用户输入过程中表单发生的操作。被React以这种方式控制取值的表单输入元素就叫做受控组件。
非受控组件：表单的value值不受状态的控制。不能给input传value，但是可以通过defaultValue 给表单一个默认值。它是通过使用ref从DOM节点中获取表单数据。
const Note: React.FC=()=>{
const [note,setNote]=useState('')
const refInput=useRef(null)
const x=()=>{
setNote(refInput.current.value)
}
return (
<input type='text' defaultValue={note} ref={refInput}
onBlur={x}>
)
}
给input一个默认值。创建一个ref,使用ref从DOM节点里获取表单的数据。具体做法：绑定input的ref属性为refInput变量的值，所以refInput.current就代表了这个input元素。onBlur是监听鼠标移出事件，通过refInput.current.value 拿到表单的数据，把这个数据存在note里。
2. React 有哪些生命周期函数？分别有什么用？
constructor ：初始化状态，数据等，创建组件的时候被调用
render ：渲染页面，创建虚拟DOM
componentDidMount ：组件被挂载之后调用（出现在页面后）。AJAX数据请求放在这里
componentDidUpdate ：页面更新后被调用。数据请求也可以放在这里
componentWillUnmount ：组件将要被从页面移除然后销毁时调用，清除定时器，取消订阅等
3. React 如何实现组件间通信？
父子组件之间：父组件给子组件通过props传递数据。还使用props给子组件传一个函数，子组件通过这个函数向父组件传递数据。
爷孙组件：两次传props
任意组件：redux。 通过redux来管理多个组件共享的状态，从而解决组件之间的通信
4. shouldComponentUpdate 有什么用？
它可以让我们手动判断是否要进行组件的更新。我们可以根据不同的场景灵活的设置它的返回值，默认返回true，表示只要组件的state或props变了，就会更新UI。如果返回false，就是不更新UI。避免一些不必要的更新。
这个钩子要手动判断，React内置了这个功能，React.PureComponent。PureComponent 会在 render 之前对比新 state 和旧 state 的每一个 key，以及新 props 和旧 props 的每一个 key。 如果所有 key 的值全都一样，就不会 render；如果有任何一个 key 的值不同，就会 render。 提高渲染性能
5. 虚拟 DOM 是什么？
虚拟DOM是用来表示DOM的对象。
执行render函数得到的结果并不是真正的DOM节点，而是一个轻量级的JS对象，这个render函数返回的JS对象我们就把他叫做虚拟DOM。
会通过diff算法比较新旧的虚拟DOM，只对变化的部分更新。即对实际的DOM进行最小化更新。
调用 DOM 的开销是很大的。而 虚拟DOM 的执行完全在 Javascript 引擎中，不会有这个开销。
6. redux是什么
Redux 是 React 的状态管理工具，提供可预测化的状态管理。
核心概念：
store：存放状态，一个redux应用只能有一个store。它的常用的API：store.getState() 用来获取state store.dispatch(action) 更新state
action：action就是一个普通的JS对象，用来描述发生了什么。要想更新state里的数据，唯一的方法就是发起一个action 。所以action就是把数据从应用传到store的载荷。
reducer：首先它是一个纯函数，接受state和action作为参数，返回一个新的state。他就是把state和action关联起来，action只说明了有什么事情要发生。具体如何更新数据就是在reducer这个函数里完成的。reducer指定了状态的变化是怎么响应action并且发送到store的
redux的核心就是单向数据流，就是说所有数据都要依照相同的生命周期，主要是四个步骤：首先调用store.dispatch发起一个action，然后调用reducer函数返回一个新的state，根reducer通过combineReducers方法把多个子reducer合并成一个state树，最后就是store保存这个新的state树。
7.connect 的原理是什么？
react-redux 库提供的一个 API。它能够使你的React组件从Redux store中读取数据，并且向store分发actions以更新数据。
