Javascript處理循環(huán)的異步操作指南
更新時(shí)間：2022年03月16日 09:14:40 作者：曼聯(lián)的小黑熊
這篇文章主要給大家介紹了關(guān)于Javascript處理循環(huán)的異步操作的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用js具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
案例：
compute.exec()這是個(gè)異步方法,在里面處理一些實(shí)際業(yè)務(wù)，這時(shí)候打印出來(lái)的很可能就是300,300,300（因?yàn)楫惒絝or循環(huán)還沒有等異步操作返回Promise對(duì)象過來(lái)i值已經(jīng)改變成300了）
function getMoney(){
var money=[100,200,300]
for(let i=0; i<money.length; i++){
compute.exec().then(()=>{
console.log(money[i])
})
}
}一、async/await 處理思路
async function getMoney(){
var money=[100,200,300]
for( let i=0; i<money.length; i++){
await compute.exec().then(()=>{
console.log(money[i])
})
}
}
// async告訴getMoney方法里面存在異步的操作
// await放在具體異步操作（方法）前面，意思是等待該異步返回Promise才會(huì)繼續(xù)后面的操作二、遞歸處理思路
function getMoney(i) {
var money=[100,200,300]
compute.exec().then(() => {
if ( i < money.length ) {
console.log(money[i]);
i++;
getMoney(i);
}
});
}
getMoney(0);//開始調(diào)用
//用遞歸來(lái)實(shí)現(xiàn)自我循環(huán)（具體循環(huán)在then里面，可以確保前面的compute.exec()的異步操作完成）.then()是返回了Promise對(duì)象為resolve后才進(jìn)行的（可以了解一下Promise對(duì)象）總結(jié)
到此這篇關(guān)于Javascript處理循環(huán)的異步操作的文章就介紹到這了,更多相關(guān)Javascript循環(huán)異步操作內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
JavaScript 2048 游戲?qū)嵗a(簡(jiǎn)單易懂)
使用javascript制作的2048小游戲非常好玩，有意思，下面給大家分享使用javascript代碼制作的2048游戲，需要的朋友參考下吧2016-03-03
利用google提供的API(JavaScript接口)獲取網(wǎng)站訪問者IP地理位置的代碼詳解
利用google提供的API(JavaScript接口)獲取網(wǎng)站訪問者IP地理位置2010-07-07
js實(shí)現(xiàn)按鈕顏色漸變動(dòng)畫效果
這篇文章主要介紹了js實(shí)現(xiàn)按鈕顏色漸變動(dòng)畫效果的方法,涉及javascript鼠標(biāo)事件及頁(yè)面表單元素樣式的動(dòng)態(tài)操作技巧,需要的朋友可以參考下2015-08-08
js下利用userData實(shí)現(xiàn)客戶端保存表單數(shù)據(jù)
對(duì)于多數(shù)網(wǎng)頁(yè)制作的朋友，實(shí)現(xiàn)在客戶端保存在網(wǎng)頁(yè)表單上的信息，比較多的是采用Cookie技術(shù)來(lái)實(shí)現(xiàn)，這些功能例如：下拉列表框選擇的選項(xiàng)，文本框輸入的數(shù)據(jù)等。2010-06-06
JavaScript實(shí)現(xiàn)控制并發(fā)請(qǐng)求的方法詳解
這篇文章主要為大家詳細(xì)介紹了如果有100個(gè)請(qǐng)求,那么如何使用JavaScript實(shí)現(xiàn)控制并發(fā)請(qǐng)求,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一2024-03-03
微信小程序開發(fā)之實(shí)現(xiàn)一個(gè)跑步小程序
本文將開發(fā)一個(gè)簡(jiǎn)易的微信跑步小程序，用到的方法是wx.onLocationChange，可以監(jiān)聽實(shí)時(shí)地理位置變化事件，感興趣的小伙伴可以了解一下2022-08-08
JavaScript實(shí)現(xiàn)五種不同煙花特效
這篇文章主要給大家?guī)?lái)五個(gè)好看的基于 HTML+CSS+JS 的煙花特效，文中的示例代碼講解詳細(xì)，對(duì)我們學(xué)習(xí)JavaScript有一定的幫助，需要的可以參考一下2022-01-01
bootstrapvalidator之API學(xué)習(xí)教程
這篇文章為大家分享了bootstrapvalidator之API學(xué)習(xí)教程，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
React Hook 是 React 16.8 版本引入的一項(xiàng)新特性，它能夠讓函數(shù)組件擁有類組件中的狀態(tài)(state)和生命周期方法(lifecycle methods)等功能。Vue 3.x 開始引入了 Hooks API，用于在函數(shù)式組件中實(shí)現(xiàn)狀態(tài)和生命周期的管理。本文介紹的非常詳細(xì)，需要的朋友可以參考下2023-04-04
TypeScript使用函數(shù)重載確定返回類型的實(shí)現(xiàn)方法
這篇文章主要介紹了TypeScript使用函數(shù)重載確定返回類型的實(shí)現(xiàn)方法，文中通過代碼示例講解的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下2024-03-03