为什么要有Promise函数
$.ajax({
type: 'GET',
url: 'api/url1',
dataType: 'json',
data: { id: 'id' },
success: function (data) {
console.log(data)
$.ajax({
type: 'GET',
url: 'api/url2',
dataType: 'json',
data: { mobile: data.mobile },
success: function (data) {
console.log(data)
$.ajax({
type: 'GET',
url: 'api/url3',
dataType: 'json',
data: { name: data.name },
success: function (data) {
console.log(data)
.
.
.
.
.
.
},
error: function (err) {
console.log(err)
}
})
},
error: function (err) {
console.log(err)
}
})
},
error: function (err) {
console.log(err)
}
})
let MyPromise1 = () => { return new Promise((resolve,reject) => {
$.ajax({
type: 'GET',
url: 'api/url1',
dataType: 'json',
data: { id: id },
success: function (data) {
console.log(data)
resolve(data);
},
error: function (err) {
console.log(err)
reject(err);
}
})
})
}
let MyPromise2 = (data) => {return new Promise((resolve,reject) => {
$.ajax({
type: 'GET',
url: 'api/url2',
dataType: 'json',
data: { mobile: data.mobile},
success: function (data) {
console.log(data)
resolve(data);
},
error: function (err) {
console.log(err)
reject(err);
}
})
})
}
let MyPromise3 = (data) => {return new Promise((resolve,reject) => {
$.ajax({
type: 'GET',
url: 'api/url3',
dataType: 'json',
data: { name: data.name },
success: function (data) {
console.log(data)
resolve(data);
},
error: function (err) {
console.log(err)
reject(err);
}
})
})
}
MyPromise1().then(res => {
return MyPromise2(res)
}).then(res => {
return MyPromise3(res)
}).catch(err => {
console.log(err)
})
let MyPromiseFn = (type,url,dataType,data) => {
return new Promise((resolve,reject) => {
$.ajax({
type: type,
url: url,
dataType: dataType,
data: data,
success: function (data) {
console.log(data)
resolve(data);
},
error: function (err) {
console.log(err)
reject(err);
}
})
})
}
MyPromiseFn('GET','api/url1','json',{id: 'id'}).then(res => {
return MyPromiseFn('GET','api/url2','json',{mobile: res.mobile})
}).then(res => {
return MyPromiseFn('GET','api/url3','json',{name: res.name})
}).catch(err => {
console.log(err)
})
Promise.all()用法
- Promise.all可以将多个Promise实例包装成一个新的Promise实例。同时,成功和失败的返回值是不同的,成功的时候返回的是一个结果数组,而失败的时候则返回最先被reject失败状态的值。
let MyPromiseFn = (type,url,dataType,data) => {
return new Promise((resolve,reject) => {
$.ajax({
type: type,
url: url,
dataType: dataType,
data: data,
success: function (data) {
console.log(data)
resolve(data);
},
error: function (err) {
console.log(err)
reject(err);
}
})
})
Promise.all([MyPromiseFn('GET','api/url1','json',{id: 'id'}),MyPromiseFn('GET','api/url3','json',{name: 'name'}),MyPromiseFn('GET','api/url2','json',{mobile: 'mobile'})]).then( res => {
console.log(res)
}).catch(err => {
console.log(res)
});
Promise.race的用法
- 这玩意是,接收一个promise的数组,只比速度无论对错,谁快就返回谁
let MyPromise1 = new Promise((resolve, reject) => {
let data = {
name: 'MY'
}
setTimeout(() => {
reject('err1');
},200)
})
let MyPromise2 = new Promise((resolve, reject) => {
let data = {
name: 'MHT'
}
setTimeout(() => {
resolve('300');
},300)
})
let MyPromise3 = new Promise((resolve, reject) => {
let data = {
name: 'WJL'
}
setTimeout(() => {
resolve('400');
},400)
})
Promise.race([MyPromise1,MyPromise2,MyPromise3]).then(res => {
console.log(res)
}).catch(err => {
console.log(err)
})