Promise非同步函式順序執行的四種方法

2021-09-11 13:27:50 字數 1652 閱讀 3720

前幾天遇到乙個程式設計題，要求控制promise順序執行，今天總結了一下這個至少有好四種方法都可以實現，包括promise巢狀，通過乙個promise串起來，generator，async實現，以下逐一介紹。 原題目如下：

//實現mergepromise函式，把傳進去的陣列順序先後執行，


//並且把返回的資料先後放到陣列data中


const timeout = ms => new promise((resolve, reject) => , ms);


});const ajax1 = () => timeout(2000).then(() => );


const ajax2 = () => timeout(1000).then(() => );


const ajax3 = () => timeout(2000).then(() => );


function mergepromise(ajaxarray) 


mergepromise([ajax1, ajax2, ajax3]).then(data => );


// 分別輸出


// 1


// 2


// 3


// done


// [1, 2, 3]


複製**
function mergepromise1(ajaxarray) ).then(data=>).then(data=>);


}複製**
function mergepromise2(ajaxarray) );


});return p;


}複製**
此方法相對於上面的方法簡單並且書寫直觀易懂，還有一種類似的任務佇列，將陣列按順序從左邊頭部取出乙個執行，執行完成後觸發自定義next方法，next方法負責從陣列中取出下乙個任務執行。

var mergepromise3 = function* (ajaxarray) 


//自動執行的run


function run(fn) 


let result = g.next(predata); //獲取每一步執行結果，其中value為promise物件，done表示是否執行完成


if (result.done) 


else );}}


next();


});}複製**
使用這種方法需要修改mergepromise方法為：

run(mergepromise3([ajax1, ajax2, ajax3])).then(data => );


複製**
const co = require('co')


co(mergepromise3([ajax1, ajax2, ajax3])).then(data => );


複製**
此方法原理和上面一樣，只是使用已有的封裝好的co模組來自動執行

function mergepromise4(ajaxarray) 


return arr;


} return run();


}複製**

Promise非同步函式順序執行的四種方法

前幾天遇到乙個程式設計題，要求控制promise順序執行，今天總結了一下這個至少有好四種方法都可以實現，包括promise巢狀，通過乙個promise串起來，generator，async實現，以下逐一介紹。原題目如下 實現mergepromise函式，把傳進去的陣列順序先後執行，並且把返回的資料先...

promise執行順序總結

1 const promise new promise resolve,reject promise.then console.log 5 執行結果是 1,2,5,4 解釋 promise的建構函式是同步執行，promise.then中的函式是非同步執行。2 const promise new pr...

Promise 非同步函式順序問題解決

在專案中 寫到for迴圈結束之後再去呼叫乙個函式 我用的是vue 記錄一下 這裡是迴圈得到一些資料之後再進行函式呼叫 const arr const that this that.imagestrs that.imageidtemparr var arr console.log this.imgli...