useState

const [state, setState] = useState(initialState);
setState将重新渲染组件加入队列,后续的渲染每次将取得最新得state。
setState也可以传入函数,参数为最新的state,如果传入当前的state,将不触发子组件更新和effect
initialState也可以传入有返回默认值的函数,但都只会初始渲染执行一次
useState的setState不会合并对象
React 使用 Object.is比较算法 来比较 state。

useLayoutEffect

基本和useEffect一致,不过 会在所有DOM变更后执行
与 componentDidMount、componentDidUpdate 的调用阶段是一样的
可以读取到DOM
浏览器执行绘制前,内部更新计划同步刷新

useEffect

浏览器完成布局和绘制过后被调用
传入effect函数和依赖数组
effect函数将在组件渲染到屏幕后执行,可返回卸载函数,在组件卸载前执行

useContext

const value = useContext(MyContext);
上层最近的Context.providoer更新时,该hook将触发重新渲染,即使受到memo和shouldComponentUpdate限制
渲染过大通过使用 memoization 来优化

useReducer

const [state, dispatch] = useReducer(reducer, initialArg, init);
dispatch时稳定的,不会在组件渲染时改变,因此不用写到useEffect和useCallback依赖里面
初始值可以只有initialArg,也可以是上面的init(initialArg)
如果reducer返回的state和上一个一样,那也将跳过渲染

useCallback

const memoizedCallback = useCallback( () => { doSomething(a, b); }, [a, b], );
返回函数的memoized版本

useMemo

const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);
返回值的我memoized版本,渲染期间执行,因此不要执行渲染无关操作
useCallback(fn, deps) 相当于 useMemo(() => fn, deps)

useRef

const refContainer = useRef(initialValue);
可以索引dom,也可以索引state

useImperativeHandle

useImperativeHandle(ref, createHandle, [deps])
应当与 forwardRef 一起使用
craeteHandle返回一个对象到父组件的ref.current中

useDebugValue

useDebugValue(value)
待补充