什么是capture value？

capture value 直译过来叫捕获值，也可以说是固定的值。指的是在react hooks中的某一个state虽然发生改变后，我们现在拿到的还是原先的值，这样解释起来不太清晰，我们来看一个例子：

function Demo() {
  const [count, setCount] = useState(0);

  useEffect(() => {
    const timer = setTimeout(() => {
      console.log(count)
    }, 3000);
    return () => {
      clearTimeout(timer);
    }
  }, [])

  return (
    <button
      onClick={() => setCount(c => c + 1)}
    >
      click
    </button>
  )
}

当页面渲染之后，我们点击按钮，是count增加，但是3秒钟之后打印出来的count还是0，并没有改变，这种现象就是capture value特性。

为什么会出现这种现象呢？

react在初次渲染的时候，是指了setTimeout函数，把里面的函数放在异步队列里面，待3秒钟之后再执行，此时count的状态值为0，而后面执行setCount之后，再次刷新页面，然后useEffect hook 里面的函数因为没有依赖更新不会再执行，跟useEffect无关，所以，这里面函数的状态也不会改变，3秒之后count打印出来还是原先的值。