js利用遞歸與promise 按順序請求數(shù)據(jù)的方法
問題:項目中有一個需求,一個tabBar下面如果沒有內(nèi)容就不讓該tabBar顯示,當(dāng)然至于有沒有內(nèi)容,需要我們通過請求的來判斷,但是由于請求是異步的,如何讓請求按照tabBar的順序進行?
方案:我們可以將promise變成下一個請求,可以利用遞歸來實現(xiàn)
實施:
//定義初始數(shù)據(jù) requestlist就像tabBar列表
let requestlist = [1, 2, 3, 4, 5, 6, 7,8,9];
//每個tabBar的返回數(shù)據(jù)使用reslist裝起來
let reslist = [];
function startapi() {
//定義counts,用來收集請求的次數(shù),(也可以用reslist的length進行判斷)
let counts = 0;
return function apirequest() {
let arg =arguments[0]
let a = new Promise((res, rej) => {
//setTimeout模擬請求到接收的時間需要5秒鐘
setTimeout(function () {
res('成功返回數(shù)據(jù)');
},100)
})
//無論成功或者失敗都要進行下一次,以免阻塞,成功請求的末尾有s標(biāo)志,失敗的末尾有f標(biāo)志
a.then(() => {
counts++;
if (counts > requestlist.length) {
return;
}
console.log(counts)
//1,假設(shè)當(dāng)前請求出錯的時候我們認(rèn)為這不合法,假設(shè)此時counts為3
if(counts==3){
throw new Error('第三個失敗')
}
//2,假設(shè)當(dāng)前請求下沒有數(shù)據(jù)的時候我們認(rèn)為不合法 ,假設(shè)此時counts為4
if(counts==4){
reslist.push(arg + 'f');
}
if(counts!=4){
reslist.push(arg + 's');
}
apirequest(requestlist[counts])
console.log(reslist)
}).catch(err => {
reslist.push(arg + 'f');
//遞歸調(diào)用
apirequest(requestlist[counts])
console.log(err)
})
}
}
let newapiget = startapi();
newapiget(requestlist[0])
最終我們打印結(jié)果得到:

可以看到第三個和第四個結(jié)尾為f
總結(jié)
以上所述是小編給大家介紹的js利用遞歸與promise 按順序請求數(shù)據(jù)的方法,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
如果你覺得本文對你有幫助,歡迎轉(zhuǎn)載,煩請注明出處,謝謝!
相關(guān)文章
JS輕松實現(xiàn)CSS設(shè)置,DIV+CSS常用CSS設(shè)置
JS輕松實現(xiàn)CSS設(shè)置,DIV+CSS常用CSS設(shè)置...2007-02-02
信息頁文內(nèi)畫中畫廣告js實現(xiàn)代碼(文中加載廣告方式)
一般來說文章內(nèi)容中的廣告點擊率更好,也更容易被訪客看到,如果直接將廣告放到頁面頭部會影響網(wǎng)站的速度,所以一般都比較喜歡這種方法,這里分享下實現(xiàn)方法2016-01-01
JavaScript中instanceof運算符的用法總結(jié)
這篇文章主要是對JavaScript中instanceof運算符的用法進行了詳細(xì)的總結(jié)介紹,需要的朋友可以過來參考下,希望對大家有所幫助2013-11-11
javascript實現(xiàn)移動的模態(tài)框效果
這篇文章主要為大家詳細(xì)介紹了javascript實現(xiàn)移動的模態(tài)框效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-09-09

