useEffect的回调的return语句什么时候执行？

我想澄清我对这里发生的事情的理解。任何改善我目前理解的细节将不胜感激。

function Timer() {

    let [time, setTime] = useState(5);

    useEffect(() => {
        let timer = setInterval(() => {
          setTime(time - 1);
        }, 1000)
        return () => clearInterval(timer);
    }, );

    return <div>{time}</div>
}

export default Timer

https://codesandbox.io/s/cranky-chaplygin-g1r0p

1. time正在初始化为5.
2. useEffect已读。它的回调必须准备好稍后触发。
3. 该div呈现。
4. useEffect的回调被执行。setInterval的回调准备好触发。当然useEffect'sreturn语句不会在这里触发，因为如果它触发它会取消计时器（并且计时器确实有效）。
5. 大约 1 秒后，setInterval的回调触发将time( 到 4)的状态更改。
6. 现在一个状态发生了变化，函数被重新执行。time，一个新变量，被初始化为新的时间状态。
7. useEffect读取一个新的，它的回调准备稍后触发。（发生这种情况是因为没有 的第二个参数useEffect()）。
8. 执行组件函数的return语句。这有效地重新渲染了div.
9. 在某些时候，前一个useEffect的return语句会执行（这会禁用timer前一个中的useEffect）。我不确定什么时候会发生这种情况。
10. 'new'useEffect的回调被执行。

回答

useEffect(() => {
  return () => {
    console.log("unmounts");
  };
}, []);