• async 函数是 Generator 函数的语法糖。

  • async 函数对 Generator 函数的改进体现在:

  1. async 内置执行器。

    Generator 函数的执行必须靠执行器,需要调用 next() 方法,或者用co 模块;

    而 async 函数自带执行器。也就是说,async 函数的执行与普通函数一模一样,只要一行。
  2. 更好的语义。

    async 和 await 比起星号和 yield,语义更清楚。
  3. 更广的适用性。

    co 模块约定,yield 命令后面只能是 Thunk 函数或 Promise 对象,

    而 async 函数的 await 命令后面可以是 Promise 对象和原始类型的值(数值、字符串和布尔值,但这时等同于同步操作)。
  4. async 返回值是 Promise,可以用 then 方法指定下一步的操作。

    比 Generator 函数的返回值是 Iterator 对象方便多了。
  • async函数返回的 Promise 对象的状态变化

    async函数返回的 Promise 对象,必须等到内部所有await命令后面的 Promise 对象执行完,才会发生状态改变,除非遇到return语句或者抛出错误。也就是说,只有async函数内部的异步操作执行完,才会执行then方法指定的回调函数。

  • await 命令

    正常情况下,await命令后面是一个 Promise 对象。如果不是,会被转成一个立即resolve的 Promise 对象。

  • 只要一个await语句后面的 Promise 变为reject,那么整个async函数都会中断执行。

    有时,我们希望即使前一个异步操作失败,也不要中断后面的异步操作。这时可以将第一个await放在try...catch结构里面,这样不管这个异步操作是否成功,第二个await都会执行。

async function f() {
try {
await Promise.reject('出错了');
} catch(e) {
}
return await Promise.resolve('hello world');
}
f()
.then(v => console.log(v))
// hello world

另一种方法是await后面的 Promise 对象再跟一个catch方法,处理前面可能出现的错误。

async function f() {
await Promise.reject('出错了')
.catch(e => console.log(e));
return await Promise.resolve('hello world');
}
f()
.then(v => console.log(v))
// 出错了
// hello world
  • 使用注意点:
  1. await命令后面的Promise对象,运行结果可能是rejected,所以最好把await命令放在try...catch代码块中。
// 第1种写法
async function myFunction() {
try {
await somethingThatReturnsAPromise();
} catch (err) {
console.log(err);
}
}
// 第2种写法
async function myFunction() {
await somethingThatReturnsAPromise()
.catch(function (err) {
console.log(err);
});
}
  1. 多个await命令后面的异步操作,如果不存在继发关系,最好让它们同时触发。

    不同时触发(继发)的语句:
let foo = await getFoo();
let bar = await getBar();

上面代码中,getFoo和getBar是两个独立的异步操作(即互不依赖),被写成继发关系。这样比较耗时,因为只有getFoo完成以后,才会执行getBar,完全可以让它们同时触发。

同时触发的语句:

// 写法一
let [foo, bar] = await Promise.all([getFoo(), getBar()]);
// 写法二
let fooPromise = getFoo();
let barPromise = getBar();
let foo = await fooPromise;
let bar = await barPromise;

上面两种写法,getFoo和getBar都是同时触发,这样就会缩短程序的执行时间。

3. await命令只能用在async函数之中,如果用在普通函数,就会报错。

async(await)知识点的更多相关文章

  1. Promise及Async/Await

      一.为什么有Async/Await? 我们都知道已经有了Promise的解决方案了,为什么还要ES7提出新的Async/Await标准呢? 答案其实也显而易见:Promise虽然跳出了异步嵌套的怪 ...

  2. 【学习笔记】深入理解async/await

    参考资料:理解javaScript中的async/await,感谢原文作者的总结,本文在理解的基础上做了一点小小的修改,主要为了加深自己的知识点掌握 学完了Promise,我们知道可以用then链来解 ...

  3. 浅谈C#中的 async await 以及对线程相关知识的复习

    C#5.0以后新增了一个语法糖,那就是异步方法async await,之前对线程,进程方面的知识有过较为深入的学习,大概知道这个概念,我的项目中实际用到C#异步编程的场景比较少,就算要用到一般也感觉T ...

  4. ES8之async/await学习随笔

    详细学习参考文档: 阮一峰老师的博客,覆盖知识点ES6/7/8/9,本篇学习笔记对阮老师的关于async/await文档中的知识点进行分点总结 在ES8中加入async/await新特性后,很明显带来 ...

  5. 异步编程async/await

    什么是异步? 在异步程序中,程序代码不需要按照编写时的顺序严格执行,有时需要一在一个新的线程中运行一部分代码,有时无需创建新的 线程,但是为了更好的利用单个线程的能力,需要改变代码的执行顺序. 进程 ...

  6. JS异步编程 (2) - Promise、Generator、async/await

    JS异步编程 (2) - Promise.Generator.async/await 上篇文章我们讲了下JS异步编程的相关知识,比如什么是异步,为什么要使用异步编程以及在浏览器中JS如何实现异步的.最 ...

  7. 深入理解理解 JavaScript 的 async/await

    原文地址:https://segmentfault.com/a/1190000007535316,首先感谢原文作者对该知识的总结与分享.本文是在自己理解的基础上略作修改所写,主要为了加深对该知识点的理 ...

  8. 微信小程序捕获async/await函数异常实践

    背景 我们的小程序项目的构建是与web项目保持一致的,完全使用webpack的生态来构建,没有使用小程序自带的构建功能,那么就需要我们配置代码转换的babel插件如Promise.Proxy等:另外, ...

  9. 异步Promise及Async/Await最完整入门攻略

    一.为什么有Async/Await? 我们都知道已经有了Promise的解决方案了,为什么还要ES7提出新的Async/Await标准呢? 答案其实也显而易见:Promise虽然跳出了异步嵌套的怪圈, ...

  10. 异步Promise及Async/Await可能最完整入门攻略

    此文只介绍Async/Await与Promise基础知识与实际用到注意的问题,将通过很多代码实例进行说明,两个实例代码是setDelay和setDelaySecond. tips:本文系原创转自我的博 ...

随机推荐

  1. sql 2005 代码导入excel数据

     select * into bm from OpenDataSource( 'Microsoft.ACE.OLEDB.12.0', 'Data Source="G:\bm.xls" ...

  2. EBS标准的查看供应商地点

    VO数据源:oracle.apps.pos.supplier.server.SitesVO SELECT pvsa.address_style, hzl.language, pvsa.province ...

  3. 疑难en_a

    1◆ a   æ eɪ ʌ ɑː ə      

  4. json 与字符串相互转换,

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...

  5. window的一些属性

    <!doctype html> <html> <head> <meta charset="utf-8"> <meta name ...

  6. 最全的CSS浏览器兼容问题【FF与IE】

    1. Div居中问题 div设置 margin-left, margin-right 为 auto 时已经居中,IE 不行,IE需要设定body居中,首先在父级元素定义text-algin: cent ...

  7. Nutch相关视频教程3

    参考: http://www.cnblogs.com/huligong1234/p/3515214.html

  8. logging- 日志记录

    https://www.cnblogs.com/yyds/p/6901864.html logging提供给了两种记录日志的方式: 第一种方式是使用logging提供的模块级别的函数 import l ...

  9. wilber3申请数据的直接目录寻找

    ftp://ds.iris.edu/pub/userdata/

  10. oracle不小心更新了数据库中的所有内容后的恢复

    开发过程中,在更新数据库中的某一条数据时,由于疏忽忘记加where判断条件了,这时更新会提示是否要更新全部数据,但是由于自己没有仔细看提示导致直接点确定并commit了,导致数据库中所有数据的相关字段 ...