Promise是一套解决编程中异步操作问题的方案。所谓Promise对象，其实就像一个容器，包裹着一个未来才会发生（或结束）的事件的结果。比如发请求，请求发出去之后要等一段时间之后才能收到结果（即使这个时间很短，但总不是立刻就能收到响应；为方便理解，你也可以夸张一点想象，比如请求发出之后要几天才能得到响应）。
Promise对象的特点
1.对象的状态不受外界影响，只取决于异步操作的结果。Promise的状态有三种：pending（进行中）、fulfilled（已成功，后面用resolved代替）和rejected（已失败）。Promise的状态的改变取决于异步操作的结果，如果异步操作是成功的，那么状态由pending变成fulfilled，否则由pending变成rejected.
2.一旦状态改变，就不会再变，任何时候都可以得到这个结果。如果异步操作已经成功了，那么它的状态就变成了fulfilled,你任何时候传入回调函数，它都只会执行“成功的回调函数”。
3.Promise对象一旦新建就会立即执行。
缺点：如果不设置回调函数，promise抛出错误信息不会传到外部，只是内部自己知道。
resolve()和reject()函数
//创建一个Promise实例,这里即promise
const promise= new Promise(function(resolve,reject){
if(/*异步操作成功*/)
resolve() //调用resolve，将promise的状态改为fulfilled，后面会根据这个状态去调用相应的回调函数
})else{
/*异步操作失败*/
reject() //调用reject，将promise的状态改为rejected，后面会根据这个状态去调用相应的回调函数
}
文档中有一段话很重要，可以帮助你很好的理解resolve和reject函数的作用：
resolve函数的作用是，将Promise对象的状态从“未完成”变为“成功”（即从 pending 变为 resolved），在异步操作成功时调用，并将异步操作的结果，作为参数传递出去；reject函数的作用是，将Promise对象的状态从“未完成”变为“失败”（即从 pending 变为 rejected），在异步操作失败时调用，并将异步操作报出的错误，作为参数传递出去。
从这段话我们可以总结出resolve和reject函数两个重要的作用：
1.改变状态
2.将异步操作的结果传出去。异步操作的结果会作为resolve和reject的参数传递出去。
promise实例的then()方法
Promise实例生成后，有一个then()方法，这个方法接受2个参数，分别是promise对象状态是resolved时调用的函数，和promise对象状态是rejected时调用的函数。如果调用resolve函数和reject函数时带有参数，那么它们的参数会被传递给回调函数。
一般来说，调用resolve或reject以后，Promise 的使命就完成了，后继操作应该放到then方法里面，而不应该直接写在resolve或reject的后面。所以，最好在resolve()前面加上return语句，这样就不会有意外。
几个例子
- promise创建后立即执行
let promise = new Promise(function(resolve, reject) {
console.log('Promise'); //创建后立即执行，所以打印出‘Promise’
resolve();
});
promise.then(function() { //promise对象的回调，会被推入到异步进程里，要等到所有同步脚本执行完才会执行
console.log('resolved.');
});
console.log('Hi!'); //在创建promise对象之后的同步脚本，打印出‘Hi’
// Promise
// Hi!
// resolved
Promise 新建后立即执行，所以首先输出的是Promise。然后，then方法指定的回调函数，将在当前脚本所有同步任务执行完才会执行，所以resolved最后输出。
- 用Promise对象实现的 Ajax 操作的例子
const getJSON = function(url) {
const promise = new Promise(function(resolve, reject){
const handler = function() {
if (this.readyState !== 4) {
return;
}
if (this.status === 200) {
resolve(this.response);
} else {
reject(new Error(this.statusText));
}
};
const client = new XMLHttpRequest();
client.open("GET", url);
client.onreadystatechange = handler;
client.responseType = "json";
client.setRequestHeader("Accept", "application/json");
client.send();
});
return promise;
};
getJSON("/posts.json").then(function(json) {
console.log('Contents: ' + json);
}, function(error) {
console.error('出错了', error);
});
- resolve函数的参数可以是另外一个promise对象
const p1 = new Promise(function (resolve, reject) {
setTimeout(() => reject(new Error('fail')), 3000)
})
const p2 = new Promise(function (resolve, reject) {
setTimeout(() => resolve(p1), 1000)
})
p2
.then(result => console.log(result))
.catch(error => console.log(error))
// Error: fail
以上，p2 的reslove()方法将p1作为参数。这时候，p2的状态变成了由p1决定，如果p1的状态是pending，那么p2的回调函数就会等待p1的状态改变；如果p1的状态已经是resolved或者rejected，那么p2的回调函数将会立刻执行。
上面代码中，p1是一个 Promise，3 秒之后变为rejected。p2的状态在 1 秒之后改变，resolve方法返回的是p1。由于p2返回的是另一个 Promise，导致p2自己的状态无效了，由p1的状态决定p2的状态。所以，后面的then语句都变成针对后者（p1）。又过了 2 秒，p1变为rejected，导致触发catch方法指定的回调函数。
网友评论