体验stage-3 async/await
ECMAScript官方提出的异步解决方案(可能是阶段性的终极方案), 原理是generator的执行器(官方逼死同人系列ww[co]). 越新的东西越傻瓜, 所以来体验下.
本文所有的结论都是基于babel的preset-stage-1环境编译实验的结果(这个性质是stage-3的, 只是偷懒?)
基本语法
async
在function
前修饰函数, 使函数变为async函数. 形如:
1 | async function() { |
在async函数内可以使用await
来修饰async函数内的方法. 形如:
1 | async function() { |
await
await
可以用来修饰同步方法和promise方法.await
修饰callback方法没有意义. (也就是不会去取callback的结果)
await修饰同步方法
如果一个async函数中存在多个await
修饰的方法:
1 |
|
执行结果与不加await
相同. 顺序执行.
await修饰promise方法
如果一个async函数中存在多个await
修饰promise的方法:
1 | let promiseFn = function (sucPossibility = 1, delay = 0) { |
以上是实验的代码, 得出几个结论:
- 经过
await
修饰的方法会直接返回promise的resolve结果, 来替代promise - 如果有多个
await
修饰的promise函数, 无论是否有依赖关系都将会依次执行并等待promise返回结果再执行下一步. 也就是这个地方以前需要用回调来些. await
修饰过的promise返回的是resolve结果, 如果失败程序会报错发出退出信号, 所以必须加catch来捕获错误, 或者把await放在try
块中.- 如果promise被reject, catch到错误的话程序会继续运行, await修饰过的方法范围值为
undefined
.
async
async函数的返回值很容易理解, 有以下特点:
return
任何值的async函数都将被立即接收到.1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22let promiseFn = function (sucPossibility = 1, delay = 0) {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (Math.random() <= sucPossibility) {
resolve(`sucMsg`);
} else {
reject(`errMsg`);
}
}, delay);
})
};
let promiseAsync = async function () {
let promiseSuc = await promiseFn(1, 0);
console.log(`promise suc: ${promiseSuc}`);
let promiseErr = await promiseFn(0, 0).catch(err => {
console.log(`catched err: ${err}`)
});
console.log(`promise err: ${promiseErr}`);
};
let asyncReturn = promiseAsync();
console.log(`async fn returned ${asyncReturn}`);以上代码执行的结果是
1
2
3
4async fn returned [object Promise]
promise suc: sucMsg
catched err: errMsg
promise err: undefined也就是async的返回值行为与同步函数一样. 所以个人认为他要被应用在异步函数处理的时候大多数会以匿名函数的形式出现.
return
的值会被promisefy. 如果返回一个基础类型的值(包括null
,0
,undefined
)或者function
, 会被包装在promise的resolve中.
(本文完)
如果你觉得本文对你有帮助, 你可以请我喝一杯咖啡
本文遵循cc协议
你可以在注明出处和非商用的前提下任意复制及演绎