@serco > “。。在 callback 里面调用另一个真正需要执行的 function ， 这个 function 用 useCallback 来根据 count 生成。”
这个效果应该跟 useEffect 是一样的，dom 上的 callback 执行与 useCallback 执行不是 1:1 的。

“callback 里面用 setCount(count => ...)这种基于前值修改的方式。”
这种方式是可以，但有时很麻烦，比如说：
```
if(count %3 == 0) {};
if(count %3 == 1) setCount(pre=>pre+1);
if(count %3 == 2) setCount(pre=>pre+2);
```

if 语句里还是要读取 count 的最新值。用函数形式实现就很反直觉（本来是用 count 值来判断是否需要 setCount 的，现在必须调用 setCount 来获取 count 的最新值）：

setCount(pre=>{
if(pre%3==0) return ???
if(pre%3==1) return pre+1;
...
});

@shuding #9
callback 的重新创建，主要是希望能引用到最新的 count ，在最新 count 的基础上修改为新值。如果不重新创建 callback ，那 callback 闭包引用的 count 就是固定的旧值了。

@gydi > “数据量大的话，useEffect 的执行就没有 callback 频繁了吧”

我测试了一下，25000 条渲染和 50 条的情况下，2 者的执行次数确实有差异。
帧率高的时候 callback 和 useEffect 基本是交叉一次，偶尔有例外。帧率低时 callback 明显更频繁。

这确实解释了为什么帧率低的时候能明显发现这个问题。帧率高时可能是不明显。

现在发现这个问题，其实就是怎么在 hook 里获取某个 state 的最新值。useEffect 里面的回调要用某个 state 的话，那 useEffect 能提供的更新频率就不够了。

@TWorldIsNButThis #4 也有 remove 的操作啊
@westoy #7 我去了解下，这个看名字像是与 Dom 相关的吧。

@gydi
但是 callback 本身会修改 count ，count 变了的话，就会触 useEffect 。这样 useEffect 用到的不就始终是最新的吗？

@cyitao
我知道可以这样改，但为什么主题里的代码会出问题呢？问题出在哪里我没有想明白。

谢谢你的回答，不过如果只是为了寻找一个暂时的答案，我也不用整理最小 demo 发在这里询问大家了。

收藏了

@mufeng
嗯，看来回调的地方也要注意：lambda 表达式每次都是生成一个新的实例。

@otakustay
对的，应该是因为 type 一直在变

@maichael
原来如此！！一不注意又进了 lambda 的「陷阱」。。怪不得楼上都在说移到外面。

@luvsic 但为什么会 unmount 呢？难道所有的 re-render 都会 unmount 所有子组件？这不可能吧。

@withoutxx
是重新生成 SubComponent 啊，React 的 render 就是这个流程啊，但是为啥会 unmount 呢？

按我的理解，再次渲染时，父子组件的结构并没有变，就不应该 unmount 啊。

组件的结构⬇️
```
<Main>
...
<SubComponent />
</Main>
```

根本不用怕上传虚假信息。为什么呢？因为哪家的菜便宜，哪家的贵，基本固定，除非搞活动打折。
「我家附近有个大型超市，豆角 8 块一斤。原来北边有个菜场菜很便宜，可惜给拆了。不过，西边又新建了个更大的菜场，里面豆角只要 6 块多，还好挑。另外还有个生鲜超市，价格不低，不过蔬菜水果经常有打折，可以去碰碰运气。」

@Uahh 是百万分之四吧，0.0004%

给 OP 提个可能的 bug：

100000 的投胎池子还是有点小，中国占了 9%，按人口比例估算，像是安道尔、开曼、法罗、列支敦士登、摩纳哥、格陵兰。。这些浪漫的国度，直接小数了连 1 个胎位都占不了。。我没具体验证，看着像是。

@xz410236056 #34
嗯，我现在是初次接触，觉得很麻烦，目前的感觉是为了严谨，牺牲了方便。后面还会再研究下。

我特意试了一下 javascript 的，
```
let str="helloworld 你好世界";
console.log(str[1], str[10], str[11]);
```

打印出"e 你 好"，这就很符合直觉啊。

真有才。。