BFE.devAI解答 - React 小测验
19. lazy initial state

这段代码的输出结果是什么？

2
1

为什么？

首先，在调用 ReactDOM.render 前，App 组件会被调用一次以初始化组件的状态和副作用。在这个过程中，useState 和 useEffect 都会被调用。

1. 调用 useState(1) 会初始化 state1 状态为 1。
2. 调用 useState(() => {console.log(2); return 2;}) 先打印出 2，并将 state2 状态初始化为 2。
3. 调用 console.log(state1)，输出 1。
4. 调用 useEffect，传入空依赖项数组，表示只在组件挂载时执行。在函数体中，调用 setState1(3)，更新 state1 的值为 3。
5. App 返回 null，不产生 DOM 节点。
6. 最后，ReactDOM.render 将 App 渲染到页面上。因为 state1 已经在上一次调用 App 时被更新为 3，所以此时不会再次调用 console.log(state1)。

因此，输出为：

2
1