处理多个异步请求
⼀个前台页⾯需要请求2个rest接⼝获取数据,⼀个⽤于解析⽂件获取列名,⼀个查询数据库获得列值。
有很低的概率页⾯显⽰为空,刷新可能就有显⽰了。
使⽤就解决了上⾯的问题,2部分数据都取到后再显⽰。需要请求多个接⼝获取数据时,由于是同时发送多个请
求,也可以减少前台等待时间。
⼀、的使⽤
可以将多个Promi实例包装成⼀个新的Promi实例。同时,成功和失败的返回值是不同的,成功的时候返回的是⼀个结
果数组,⽽失败的时候则返回最先被reject失败状态的值。
具体代码如下:
letp1=newPromi((resolve,reject)=>{
resolve('成功了')
})
letp2=newPromi((resolve,reject)=>{
resolve('success')
})
letp3=('失败')
([p1,p2]).then((result)=>{
(result)//['成功了','success']
}).catch((error)=>{
(error)
})
([p1,p3,p2]).then((result)=>{
(result)
}).catch((error)=>{
(error)//失败了,打出'失败'
})
在处理多个异步处理时⾮常有⽤,⽐如说⼀个页⾯上需要等两个或多个ajax的数据回来以后才正常显⽰,在此之前只显⽰
loading图标。
代码模拟:
letwake=(time)=>{
returnnewPromi((resolve,reject)=>{
tTimeout(()=>{
resolve(`${time/1000}秒后醒来`)
},time)
})
}
letp1=wake(3000)
letp2=wake(2000)
([p1,p2]).then((result)=>{
(result)//['3秒后醒来','2秒后醒来']
}).catch((error)=>{
(error)
})
需要特别注意的是,获得的成功结果的数组⾥⾯的数据顺序和接收到的数组顺序是⼀致的,即p1的结果在前,即
便p1的结果获取的⽐p2要晚。这带来了⼀个绝⼤的好处:在前端开发请求数据的过程中,偶尔会遇到发送多个请求并根据请求顺序获取和使
⽤数据的场景,使⽤毫⽆疑问可以解决这个问题。
⼆、的使⽤
顾名思义,就是赛跑的意思,意思就是说,([p1,p2,p3])⾥⾯哪个结果获得的快,就返回那个结果,不管结果
本⾝是成功状态还是失败状态。
letp1=newPromi((resolve,reject)=>{
tTimeout(()=>{
resolve('success')
},1000)
})
letp2=newPromi((resolve,reject)=>{
tTimeout(()=>{
reject('failed')
},500)
})
([p1,p2]).then((result)=>{
(result)
}).catch((error)=>{
(error)//打开的是'failed'
})
原理是挺简单的,但是在实际运⽤中还没有想到什么的使⽤场景会使⽤到。
本文发布于:2022-12-28 05:12:48,感谢您对本站的认可!
本文链接:http://www.wtabcd.cn/fanwen/fan/90/44833.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
留言与评论(共有 0 条评论) |