Promise是异步里面的一种解决方案,解决了回调嵌套的问题,es6将其进行了语言标准,同意了用法,提供了`promise`对象, promise对象有三种状态:pending(进行中) 、Resolved(已经完成)和Rejected(已失败)
ES6规定,Promise对象是一个构造函数,用来生成Promise实例。
1
2
3
4
5
6
7
|
var
promise=
new
Promise(
function
(resove,reject){
if
(
/* 异步操作成功 */
){
resolve(value);
}
else
{
reject(error);
}
})
|
Promise实例生成以后,可以用then
方法分别指定Resolved
状态和Reject
状态的回调函数。
1
2
3
4
5
|
promise.then(
function
(value) {
// success
},
function
(error) {
// failure
});
|
案例
1
2
3
4
5
6
7
|
var
promise=
new
Promise(
function
(resolve,reject){
console.log(
'promise'
);
})
promise.then(
function
(){
console.log(
'我后执行'
)
})
console.log(
'我先执行'
)<br><br>
//上面代码中,Promise新建后立即执行,所以首先输出的是“Promise”。然后,<code>then</code>方法指定的回调函数,<br>//将在当前脚本所有同步任务执行完才会执行,所以“我后执行” 最后输出。
|
ajax
var
http = {
get:
function
(url) {
var
promise =
new
Promise(
function
(resolve, reject) {
$.ajax({
url: url,
method:
'get'
,
success:
function
(data) {
resolve(data);
},
error:
function
(xhr, statusText) {
reject(statusText);
}
});
});
return
promise;
}
};
http.get(
'solve.php'
).then(
function
(data) {
return
data;
},
function
(err) {
return
Promise.reject(
'Sorry, file not Found.'
);
}).then(
function
(data) {
document.write(data);
},
function
(err) {
document.write(err);
});
Promise三种状态
pending、resolved、rejected
使用语法
var promis = new Promise(function(resolve,reject){ $.ajax({ url:'/api/something.json', method:'get', datatype:'json', success:(res) =>{ resolve(res) }, error:(err)=>{ reject(err) } }) }) promis.then(function(res){ console.log(res) }).catch(function(err){ console.log(err) });
Promise.prototype.then()
链式调用,状态变为resolve
如果把下一步想要的东西return出去,即可让下一个then使用
var promise = new Promise(function(resolve,reject){ $.ajax({ url:'/api/poisearch.json', method:'get', datatype:'json', success:(res) =>{ resolve(res) }, error:(err)=>{ reject(err) } }) }) promise.then(function(res){ return res.data }).then(function(data){ return data.result; }).then(function(result){ console.log(result) });
上面的代码还可以借用箭头函数简写成,极大提升了代码的简洁性和可读性
promise.then(res => res.data)
.then(data => data.result) .then(result => console.log(result));
Promise.prototype.catch()
如果异步操作抛出错误,状态就会变为Rejected,就会调用catch方法指定的回调函数,处理这个错误。
- 另外,then方法指定的回调函数,如果运行中抛出错误,也会被catch方法捕获。
- 如果Promise状态已经变成Resolved,再抛出错误是无效的。
- catch方法返回的还是一个Promise对象,因此后面还可以接着调用then方法。