其实useReducer和useState有点相似，useState之前介绍过是useReducer的语法糖。
我们看两个code
useEffect(() => {
console.log(a)
timerID.current = setInterval(()=>{
setCount(count => count + 1);
}, 1000);
}, []);
useEffect(()=>{
console.log(b)
if(count > 10){
clearInterval(timerID.current);
}
});
a会打印一次，而b会一直打印 原因就是第一个useEffect中第二个参数是个数组
function useEffect(callback,dependencies){
if(hookStates[hookIndex]){//说明不是第一次,
let lastDependencies = hookStates[hookIndex];
let same = dependencies.every((item,index)=>item === lastDependencies[index]);
if(same){
hookIndex++;
}else{
hookStates[hookIndex++]= dependencies;
callback();
}
}else{//说明是第一次渲染
hookStates[hookIndex++]= dependencies;
callback();
}
}
缓存下来比较每一项是否相等，same为true,因此只会打印一次a,
近些天因为项目中用了很多useState所以我也看了看useReducer，发现原来自己写了那么多useState,看着就烦所以我打算重新理解下useReducer，翻了下useReducer源码终于明白了
最新的理解 2020 / 12 / 5
当我们大量使用useState时，我们其实可以用useReducer去替代 ，useReducer有两个参数，如果第一个是个纯函数，也就是我们常常说的通过状态去区分进行哪种操作。
如果第一个参数穿了null的话，那我们的useReducer就完全和useState是一样的了，该写什么写什么 。所以useState是一个简化的useReucer版本
贴下代码如下：
