useCallback 有语义保证吗？答案

【问题标题】：Does useCallback have a semantic guarantee?useCallback 有语义保证吗？
【发布时间】：2021-07-12 05:34:28
【问题描述】：

React 文档对useMemo 进行了以下说明

您可以依赖 useMemo 作为性能优化，而不是作为语义保证。未来，React 可能会选择“忘记”一些先前记忆的值并在下次渲染时重新计算它们，例如为屏幕外组件释放内存。编写您的代码，以便它没有 useMemo 仍然可以工作 - 然后添加它以优化性能。

useCallback 有以下行：

useCallback(fn, deps) 等价于 useMemo(() => fn, deps)。

“等价”这个词对我来说有点模糊，我不知道这是否也意味着useCallback 不提供语义保证。

【问题讨论】：

未来的版本还没有写出来，所以我猜useCallback 也仍然悬而未决，除非他们在某处明确说明
如果你的记忆函数有副作用，不要相信 react 不会重新运行它。添加条件检查。
其实每一个react hook（可能除了useState）都应该有一个很大的提示——“除非你知道自己在做什么，否则不要使用”;)

标签： javascript reactjs

【解决方案1】：

如果useMemo 的返回值是一个函数，则useMemo 等于useCallback：

// The return value of `useMemo` is calculated every time deps change
useMemo(() => {
  return () => { // do some stuff }
}, [deps])

// The function block within `useCallback` is redefined every time deps change
useCallback(() => {
  // do some stuff
}, [deps])

我不知道他们为此制作单独的钩子的原因，但我猜他们在技术上做同样的事情。

至于语义保证，我想说他们可能会对useCallback 做同样的事情来“释放一些内存”，但函数内存消耗不如实际数据重要。

【讨论】：

这真的回答了关于useCallback的语义保证的问题吗？提供两个非常相似的钩子的一个原因似乎是因为 useMemo 的未来证明比其他钩子少。回调函数可能依赖于该语义保证。例如，当您使用 debounce / throttle 时。
相关：github.com/facebook/react/issues/15278