hook
是 React 16.8 的新增特性，可以在不编写 class 的情况下使用 state 以及其他的 React 特性
为什么引入 hook：
- 逻辑复用之前主要是使用高阶组件实现，但是嵌套过多会形成嵌套地狱的问题
- 之前相同的逻辑需要在不同的生命周期里写，非常分散不利于维护
- 以前，函数组件也被称为无状态的组件，只负责渲染的一些工作。现在有了 hooks 就拥有了类组件的特性，例如组件内的状态、生命周期
常见的 hook：
useState：声明组件内状态
useEffect：执行一些带有副作用的操作
- useEffect 第一个参数接受一个回调函数，默认情况下，useEffect 会在第一次渲染和更新之后都会执行，相当于在 componentDidMount 和 componentDidUpdate 两个生命周期函数中执行回调
- 如果某些特定值在两次重渲染之间没有发生变化，你可以跳过对 useEffect 的调用，这时候只需要传入第二个参数
- 回调函数中可以返回一个清除函数，相当于类组件中 componentwillUnmount 生命周期函数
useMemo：它接受一个函数和一个依赖数组。用于缓存计算结果，避免在每次渲染时都重新计算，只有当依赖项发生改变时才会重新计算
useCallback：它接收一个函数和一个依赖数组。用于缓存回调函数，避免在每次渲染时都创建新的回调，只有当依赖项发生改变时才会重新创建
setState 执行机制
- 在组件生命周期或 React 合成事件中，setState 是异步
- 在 setTimeout 或者原生 dom 事件中，setState 是同步
高阶组件
接受一个或多个组件作为参数并且返回一个组件，本质也就是一个函数
高阶函数是至少满足下列一个条件的函数：
- 接受一个或多个函数作为输入
- 输出一个函数
受控组件和非受控组件
受控组件：指表单元素的值由 React 的状态（state）控制，而不是由 DOM 自身管理
非受控组件：一般情况是在初始化的时候接受外部数据，然后自己在内部存储其自身状态