发生了什么重新定义setInterval变量在useEffect钩子?

Question

我想知道如果我在react hook useEffect中重复定义setInterval函数会发生什么。

我检查变量有新的setInterval id值每个定义。但我想知道是否有实例仍然在内存中关于以前的setInterval定时器，即使新的setInterval定义在同一变量??

useEffect(() => {
const timer = setInterval(
() => {
if (count < elementLength - 1) {
boolean.current = false;
setCount(prev => prev + 1);
} else {
boolean.current = true;
setCount(0);
}
},
boolean.current ? 50 : 2500
);
return () => {
clearInterval(timer);
};
}, [count]);

Answer 1

如果我重复分配给同一变量会发生什么?

不是相同的变量。每次效果运行时，它都会创建一个新的timer变量。它们都是独立的

但是我想知道内存中是否保留了以前timer的实例

是和不是。useEffect回调返回的清理函数是timer的闭包，并且在必要时由React保留在内存中。在实践中，当组件卸载或其依赖项更改时，它将被调用一次，并且可以在之后进行垃圾收集，并带走相应的timer变量。