Promise概述
Promise对象: 代表了未来某个将要发生的事件(通常是一个异步操作)。
ES6中的promise对象, 可以将异步操作以同步的流程表达出来,很好地解决了回调地狱的问题(避免了层层嵌套的回调函数)。在使用ES5的时候,在多层嵌套回调时,写完的代码层次过多,很难进行维护和二次开发。
promise对象的3个状态
-
初始化状态(等待状态):pending
-
成功状态:fullfilled
-
失败状态:rejected
使用promise的基本步骤
(1)创建promise对象
(2)调用promise的回调函数then()
代码格式如下:
let promise = new Promise((resolve, reject) => {
//进来之后,状态为pending
console.log('111'); //这一行代码是同步的
//开始执行异步操作(这里开始,写异步的代码,比如ajax请求 or 开启定时器)
if (异步的ajax请求成功) {
console.log('333');
resolve();//如果请求成功了,请写resolve(),此时,promise的状态会被自动修改为fullfilled
} else {
reject();//如果请求失败了,请写reject(),此时,promise的状态会被自动修改为rejected
}
})
console.log('222');
//调用promise的then()
promise.then(() => {
//如果promise的状态为fullfilled,则执行这里的代码
console.log('成功了');
}
, () => {
//如果promise的状态为rejected,则执行这里的代码
console.log('失败了');
}
)
async函数(异步函数)
概念:真正意义上去解决异步回调的问题,用同步流程表达异步操作。
本质: Generator 的语法糖。
语法:
async function foo() {
await 异步操作;
await 异步操作;
}
返回值:若在 async
函数中 return
了一个值 x
, 不管 x
值是什么类型, async
函数的实际返回值总是 Promise.resolve(x)
.
await的作用
用法:await
操作符用于等待一个 Promise
对象, 它只能在异步函数 async function
内部使用.
await 的使用语法非常简单:
[return_value] = await expression;
其中 expression 是一个 Promise 对象或者任何要等待的值;
而 await expression 的执行结果有以下几种情况:
- 若 expression 是一个 Promise 对象, 并且其以值 x 被 fulfilled, 则返回值为 x.
- 若 expression 是一个 Promise 对象, 并且其以异常 e 被 rejected, 则抛出异常 e.
- 若 expression 不是 Promise 对象, 则会将 expression 处理成一个以 expression 值被 fulfilled 的 Promise 对象, 然后返回这个 Promise 对象的最终值 (即 expression 值). 这种用法没太大意义, 因此实际使用时还是尽量在 await 后跟一个 Promise 对象.
另外需要注意的是, await 在等待 Promise 对象时会导致 async function 暂停执行, 一直到 Promise 对象决议之后才会 async function 继续执行.
async、Promise、Generator的对比
1、不需要像Generator去调用next方法,遇到await函数内部等待,让出CPU占有权给外部函数往下执行。
2、async返回的总是Promise对象,可以用then方法进行下一步操作。
3、async取代Generator函数的星号*,await取代Generator的yield。
4、语意上更为明确,使用简单,经临床验证,暂时没有任何副作用。