首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

聊聊React类组件中的setState()的同步异步(附面试题)

当我们依次按下1、2、3按钮,我们会发现1按钮的事件监听函数运行时是先运行 console.log('test1 setState()之后', this.state.count)这句代码然后在进行的render(),而在代码中 this.setState(state => ({count: state.count + 1}))这句是在前的,由此我们可以推测setState()是异步的 ,同理2,3按钮也是。 值得一提的是,按钮3中 this.setState(state => ({count: state.count + 1}), () => { // 在状态更新且界面更新之后回调 console.log('test3 setState callback()', this.state.count) }) 中有一个回调函数,在我们一般情况下是用其简写形式(对象形式),只有在需要setState()后获取最新的状态数据时才会用到函数形式的setState()。

01

Javascript中的异步编程

Javascript最开始是用于浏览器中的前端编程语言。Javascript是单线程的,为了能及时响应用户操作,javascript对耗时操作(如Ajax请求、本地文件读取等)的处理是异步进行的,也即是所谓的异步编程。除了快速响应用户操作之外,另外一个让javascript采用异步方式的原因是,程序无法预知用户会进行哪些操作。比如说程序无法提前知道用户是点“取消”按钮还是“确定”按钮。所以,Javascript采用了事件注册的方式来处理这个问题。在程序编写时,可以给用户点击“取消”按钮和“确认”按钮注册不同的回调函数,这样当用户点击不同的按钮时,不同的回调函数会被执行。本文从回调函数开始,介绍了Promise、async/await几种Javascript主要的异步编程方式。

00

你真的了解回调?

你将在本文中,学习到什么是回调,回调是一种异步操作手段,在平时的使用当中无处不在,究竟如何确定何时使用异步(跳跃式执行,稍后响应,发送一个请求,不等待返回,随时可以再发送下一个请求,例如订餐拿号等饭,发广播,QQ,微信等聊天)还是同步(顺序执行,逐行读取代码,会影响后续的功能代码,也就是发送一个请求,等待返回,然后再发送下一个请求,比如打电话,需要等到你女票回话了,才能继续下面虐狗情节),回调的重要不言而喻,然而当面试时,让你举例出哪些异步回调时,好像除了回答一个Ajax,貌似就再也难以举例了的,本文会让你认识不一样的回调,文若有误导地方,欢迎路过的老师多提意见和指正

03
领券