useState 和 useReducer 区别

1. 更新值的方法不同
2. useState 原理类似类组件的 setState，它是异步更新的，而 useReducer 是同步更新的(亲测)。
3. 更容易管理大量状态
4. 更容易被其他开发者理解
5. 更容易被测试

• https://www.jianshu.com/p/9138e63fd1a9
• https://zhuanlan.zhihu.com/p/63385235

我在测试这两个 api 的时候发现一个现象：

只要初始化了 state 的函数式组件(即意为调用了 useState 或者 useReducer)，初始化和更新值(意为更新state或者父组件传递过来的 props 发生了变化)这个函数都会被调用执行两次，但是用了 react-router-dom 的组件就不会。测试发现纯函数式组件(没有内部状态值)在初始化只会被调用执行一次，推测 react-router-dom 为纯函数式组件。所以个人得出结论是：函数式组件更新值(意为更新state或者父组件传递过来的 props 发生了变化)和初始化的时候都会调用两次，纯函数式组件(没有内部 state 值)就只会被调用执行一次。

后来经过论证和请教方方，发现上述描述和推论都是错误的，代码大致如下：

你会发现初始化和更新 n 的时候，都会 log 两次 ‘app 执行’，其实这是错误的，这只发生在开发环境下，生产环境下就初始化执行一次，更新值执行一次。或者关闭严格模式：

以上为个人测试得出，后续会深入 useState 源码进行研究，如有错误，欢迎指正。