useMemo

缓存计算结果

useMemo和useCallback一样，都是：建立了一个依赖数据和结果的绑定关系，只有当依赖变了，结果才更新。

useCallback是可以用useMemo实现的，因为函数也是一个计算结果。

使用场景

const Count = () => {
	const [count, setCount] = useState(0)
	useEffect(() => {
		setCount(count + 1)
	}, [])
	// 当count没变，但是其他逻辑导致函数重新执行的时候，`subValue`还是会重新生成，即使内容没有变化
	// 对于`<Child>`来说，`subValue`是变化了的，`<Child>`就会重新渲染
	const subValue = { count }
	return <Child prop1={subValue} />
}
 
 
// 用`useMemo`优化
const Count = () => {
	const [count, setCount] = useState(0)
	useEffect(() => {
		setCount(count + 1)
	}, [])
	const subValue = useMemo(() => {
		return { count }
	}, [count])
	return <Child prop1={subValue} />
}
 

所以useMemo除了有缓存计算结果这个作用外，还有避免子组件重复渲染的功能