1.promise
promise已一种简洁的方式实现异步回调以及关联多个异步的调用先后顺序。promise对象有三个状态,正在执行中,已结束,以及出错状态。
2.promise使用
2.1 实现AJAX异步回调
function MKBaseService() {
this.method = HttpMethod.get;
this.ServerAddress = "http://59.110.40.75:8887/";
this.serviceType = MSAPI.games;
/*promise实现回调*/
this.promiseRequest = function () {
let that = this
let promise = new Promise(function (success,error) {
let request = new XMLHttpRequest()
request.timeout = 3000
request.open(that.method,that.ServerAddress + that.serviceType)
request.send()
request.onreadystatechange = function () {
if (request.readyState == 4 && request.status == 200) {
let object = JSON.parse(request.responseText)
success(object)
}
if (request.readyState == 4 && request.status != 200){
error(request.status)
}
}
})
return promise
}
}
var service = new MKBaseService()
service.promiseRequest().then(function (response) {
console.log(response)
})
service.promiseRequest().catch(function (status) {
console.log(`error == ${status}`)
})
2.2 promise 多个promise调用关系
function random01() {
var timeOut = Math.random() * 2;
let p = new Promise(function (resolve, reject) {
setTimeout(function () {
if (timeOut>1){
resolve("01-success")
}else {
reject("01-error",p)
}
},timeOut *1000)
})
return p;
}
function random02() {
var timeOut = Math.random() * 2;
let p = new Promise(function (resolve, reject) {
setTimeout(function () {
if (timeOut>1){
resolve("02-success")
}else {
reject("02-error")
}
},timeOut *2000)
})
return p;
}
2.2.1 实现多个异步操作顺序执行例如两个异步操作a和b,a成功回调之后执行b
// 顺序执行两个promise
random01()
.then(function (data) {
console.log(data)
return random02()
})
.then(function (data) {
console.log(data)
})
.catch(function (error) {
console.log(error)
})
2.2.2 实现多个异步操作并行执行,所有操作执行完之后进行其他操作
Promise.all([random01(),random02()]).then(function () {
console.log("all is over ")
}).catch(function (error) {
console.log(error)
})
2.2.3 实现多个异步操作并行执行,第一个异步操作执行完之后进行其他操作
Promise.race([random01(),random02()]).then(function () {
console.log("have a race")
}).catch(function (error) {
console.log(error)
})