promise處理多個相互依賴的異步請求(實例講解)
在項目中,經常會遇到多個相互依賴的異步請求。如有a,b,c三個ajax請求,b需要依賴a返回的數據,c又需要a和b請求返回的數據。如果采用請求嵌套請求的方式自然是不可取的。導致代碼難以維護,如何請求很多。會出現很多問題。
Promise就是解決多個異步請求的問題。 Promise是ES6提供的一個對象,用來傳遞異步操作的消息。
Promise有三種狀態(tài):Pending(進行中)、Resolved(已完成,又稱 Fulfilled)和 Rejected(已失敗)。
直接上代碼。有a,b請求,b依賴a的請求數據。如下:
function a(){
return new Promise(function(res,rej){
$.ajax({
url:"a",
type: "GET",
async:true,
dataType:"json",
success:function(data){
console.log(data,"a");
res(data);
}
})
});
}
function b(data){
console.log(data,"data");
return new Promise(function(res,rej){
$.ajax({
url:"b",
type: "POST",
async:true,
data:JSON.stringify(data),
dataType:"json",
success:function(data){
console.log(data,"b");
res();
}
})
});
}
$("#btn").click(function(){
a().then(function (data){
b(data);
}).then(function(){
})
})
接口url在網上找了一個,可以看運行結果:

以上這篇promise處理多個相互依賴的異步請求(實例講解)就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
用JavaScript和注冊表腳本實現右鍵收藏Web頁選中文本
用JavaScript和注冊表腳本實現右鍵收藏Web頁選中文本...2007-01-01
javascript中創(chuàng)建對象的三種常用方法
在javascript中創(chuàng)建對象的三種方法,腳本之家以前發(fā)布過有簡單實例版的,大家可以參考下。2010-12-12
Javascript-Mozilla和IE中的一個函數直接量的問題分析
Javascript-Mozilla和IE中的一個函數直接量的問題分析...2007-08-08
TypeScript中import?type與import的區(qū)別詳析
ES6引入了模塊化,其設計思想是在編譯時就能確定模塊的依賴關系,以及輸入和輸出的變量,下面這篇文章主要給大家介紹了關于TypeScript中import?type與import區(qū)別的相關資料,需要的朋友可以參考下2022-07-07

