react中的setState是同步还是异步

  1. setState 只在合成事件和钩子函数中是"异步"的,在原生事件和 setTimeout 中都是同步的。

    • 合成事件:就是react 在组件中的onClick等都是属于它自定义的合成事件

    • 原生事件:比如通过addeventListener添加的,dom中的原生事件

  2. setState的"异步"并不是说内部由异步代码实现,其实本身执行的过程和代码都是同步的,只是合成事件和钩子函数的调用顺序在更新之前,导致在合成事件和钩子函数中没法立马拿到更新后的值,形式了所谓的"异步",当然可以通过第二个参数 setState(partialState, callback) 中的callback拿到更新后的结果。

  3. setState 的批量更新优化也是建立在"异步"(合成事件、钩子函数)之上的,在原生事件和setTimeout 中不会批量更新,在"异步"中如果对同一个值进行多次 setState , setState 的批量更新策略会对其进行覆盖,取最后一次的执行,如果是同时 setState 多个不同的值,在更新时会对其进行合并批量更新

相关推荐
Nan_Shu_61410 小时前
学习: Threejs (2)
前端·javascript·学习
G_G#10 小时前
纯前端js插件实现同一浏览器控制只允许打开一个标签,处理session变更问题
前端·javascript·浏览器标签页通信·只允许一个标签页
@大迁世界10 小时前
TypeScript 的本质并非类型,而是信任
开发语言·前端·javascript·typescript·ecmascript
GIS之路10 小时前
GDAL 实现矢量裁剪
前端·python·信息可视化
是一个Bug10 小时前
后端开发者视角的前端开发面试题清单(50道)
前端
Amumu1213811 小时前
React面向组件编程
开发语言·前端·javascript
持续升级打怪中11 小时前
Vue3 中虚拟滚动与分页加载的实现原理与实践
前端·性能优化
GIS之路11 小时前
GDAL 实现矢量合并
前端
hxjhnct11 小时前
React useContext的缺陷
前端·react.js·前端框架
冰暮流星11 小时前
javascript逻辑运算符
开发语言·javascript·ecmascript