useCallBack和useMemo的区别

2022-05-25 222 阅读1分钟

`useCallBack`和`useMemo`的区别

useCallBack

第一个值是一个函数
第二个值是一个依赖项的数组：可以传入一个状态，当一个状态发生改变的时候，useCallBack的回调函数重新计算。生成一个新的缓存值，如果不传的话，初始化赋值一次函数，相当于把函数缓存下来了。每次重新渲染，会直接取缓存过的回调，不用重新去创建这个函数。

对比`useCallBack`和`useMemo`

接下来我们来看useCallBack和useMemo的区别：

useCallBack是直接缓存函数，useMemo是缓存函数的返回值（return后的），可以缓存函数，也可以缓存值。

useCallBack示例代码：

  const callbackHook = useCallback(() => {
    // 缓存内容
  }, []);

useMemo示例代码：

  const memoHook = useMemo(() => {
    return {
      // 缓存内容
    }
  }, [])