試用場景涛漂,通過bmob條件查詢一個表篇梭,然后通過表返回的數(shù)據(jù)氢橙,在去查詢多個表,在把多個表查詢到的數(shù)據(jù)全部整合成一條數(shù)據(jù)恬偷,直到最后渲染到視圖層悍手,也就是各種異步操作。
先來看看Bmob的查詢
const query = new Bmob.Query(Bmob.Object.extend("all"))
query.find({
success: (res) => {
alert("查詢成功")
},
error: (error) => {
alert("查詢失敗: " + error.code + " " + error.message);
}
});
綜上所述,那么需要在success方法中寫入多個表查詢坦康,包裹多少層還不知道竣付。此時Promise完美登場。
Promise —— Javascript 中的神器
ES6 原生提供了 Promise 對象滞欠。
所謂 Promise卑笨,就是一個對象,用來傳遞異步操作的消息仑撞。它代表了某個未來才會知道結(jié)果的事件(通常是一個異步操作)赤兴,并且這個事件提供統(tǒng)一的 API,可供進一步處理隧哮。
const promise = new Promise(function(resolve, reject) {
if (/* 異步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
promise.then(function(value) {
// success
}, function(value) {
// failure
});
基本的 api
Promise.resolve()
Promise.reject()
Promise.prototype.then()
Promise.prototype.catch()
Promise.all() // 所有的完成
Promise.race() // 競速桶良,完成一個即可
結(jié)合Bmob
const BmobAll = new Promise((resolve, reject) => {
query = new Bmob.Query(Bmob.Object.extend("all"))
query.find({
success: (res) => {
resolve(res)
},
error: (error) => {
reject(error)
}
});
})
BmobAll.then(value => {
// success
// 這里即可再次進行 bmob 查表操作;
}, value => {
// failure
});
多個表同時查詢沮翔;
//任務(wù)1
const p1 = new Promise((resolve, reject) => {
query = new Bmob.Query(Bmob.Object.extend("P1"))
query.find({
success: (res) => {
resolve(res)
},
error: (error) => {
reject(error)
}
});
})
//任務(wù)2
const p2 = new Promise((resolve, reject) => {
query = new Bmob.Query(Bmob.Object.extend("P2"))
query.find({
success: (res) => {
resolve(res)
},
error: (error) => {
reject(error)
}
});
})
//任務(wù)3
const p3 = new Promise((resolve, reject) => {
query = new Bmob.Query(Bmob.Object.extend("P3"))
query.find({
success: (res) => {
resolve(res)
},
error: (error) => {
reject(error)
}
});
})
//所有的任務(wù)都請求完成之后會返回他們他們所有的值陨帆。為一個數(shù)組;在這里就可以拿到所有請求的數(shù)據(jù)了采蚀。
Promise.all([p1,p2,p3]).then((val) => {
console.log(val)
})