Async其实就是Generator函数的语法糖。

啥是语法糖?就是一种更容易让人理解,代码可读性更高的另外一种语法。

const asyncRead = async function(){
const f1 = await readFile("/etc/fstab");
const f2 = await readFile("etc/shells");
console.log(f1.toString());
console.log(f2.toString());
}

可以跟Generator函数对比:就是把(*)替换成async,将yeild换成了await,仅此而已。

不同点在于:async函数的执行,直接执行函数名  asyncRead(),就会自动执行,不需要像Generator函数那样,调用next方法才执行。

Async函数的返回值时Promise对象,而Generator函数的返回值是Iterator对象,async函数完全是可以看做是多个异步操作,包装成的一个Promise对象,而await命令只是内部then的语法糖。

1,基本用法:

在上一张的一个图中,可以看出,promise,Generator,Async/Awati的强弱关系:

Generator < Promise < Async/Await,可以看出async/await的功能之强大。所以更得好好学习呀~~~

async function timeout(ms){
await new Promise((resolve)=>{
setTimeout(resolve,ms);
})
}
async function asyncPrint(value,ms){
await timeout(ms);
console.log(value);
}
asyncPrint('hello',50)

上面代码指定50毫秒之后输hello world。

Async的多种使用形式:

// 函数声明
async function foo() {} // 函数表达式
const foo = async function () {}; // 对象的方法
let obj = { async foo() {} };
obj.foo().then(...) // Class 的方法
class Storage {
constructor() {
this.cachePromise = caches.open('avatars');
} async getAvatar(name) {
const cache = await this.cachePromise;
return cache.match(`/avatars/${name}.jpg`);
}
} const storage = new Storage();
storage.getAvatar('jake').then(…); // 箭头函数
const foo = async () => {};

1,await命令

正常情况下,await后面是一个promise对象,如果不是,会被转化为一个立即resolve的promise对象。

async function f(){
await Promise.reject('error');
}
f().then(v=>console.log(`success=>${v}`))
.catch(e=>console.log(`fail=>${e}`))
//fail=>error

await命令后面的promise对象如果变成reject状态,reject的方法参数传入了catch的回调里面,此时 整个async函数会中断执行。

如果想要前一个异步不会影响后面的异步,可以将前一个await放在try...catch里面,这样无论这个异步操作是否成功,第二个异步都会执行。或者在前一个await的promise后面加上catch语句进行捕捉reject信息,也是可以不影响后面await的执行。

async function myFunction() {
try {
await somethingThatReturnsAPromise();
} catch (err) {
console.log(err);
}
} // 另一种写法 async function myFunction() {
await somethingThatReturnsAPromise()
.catch(function (err) {
console.log(err);
});
}

注意的另外一点:

如果两个方法不存在继发关系,即两个独立的异步操作,完全可以让它们同时触发。

let foo = await getFoo();
let bar = await getBar(); let [foo,bar] = await Promise.all([getFoo(),getBar()]);

还有:await命令只能用在async函数里面,用在普通函数中会报错。

async函数的实现原理:

就是Generator函数和自动执行器,包装在一个函数里面。主要是这个自动生成器是怎么实现的?

Await/Async的更多相关文章

  1. javascript异步编程的前世今生,从onclick到await/async

    javascript与异步编程 为了避免资源管理等复杂性的问题, javascript被设计为单线程的语言,即使有了html5 worker,也不能直接访问dom. javascript 设计之初是为 ...

  2. Silverlight项目笔记1:UI控件与布局、MVVM、数据绑定、await/async、Linq查询、WCF RIA Services、序列化、委托与事件

    最近从技术支持转到开发岗,做Silverlight部分的开发,用的Prism+MVVM,框架由同事搭好,目前做的主要是功能实现,用到了一些东西,侧重于如何使用,总结如下 1.UI控件与布局 常用的主要 ...

  3. 5分种让你了解javascript异步编程的前世今生,从onclick到await/async

      javascript与异步编程 为了避免资源管理等复杂性的问题,javascript被设计为单线程的语言,即使有了html5 worker,也不能直接访问dom. javascript 设计之初是 ...

  4. es7 await/async解决异步问题

    最近做项目遇到一个问题,前端调用ie浏览器中的ocx的方法去查询数据,查询完之后ocx给一个返回值,然后js将返回值当参数传入到另外的函数中去做数据处理,但是遇到一个问题是前端需要异步去执行这个过程 ...

  5. promise 的基本概念 和如何解决js中的异步编程问题 对 promis 的 then all ctch 的分析 和 await async 的理解

    * promise承诺 * 解决js中异步编程的问题 * * 异步-同步 * 阻塞-无阻塞 * * 同步和异步的区别? 异步;同步 指的是被请求者 解析:被请求者(该事情的处理者)在处理完事情的时候的 ...

  6. 如何避免 await/async 地狱

    原文地址:How to escape async/await hell 译文出自:夜色镇歌的个人博客 async/await 把我们从回调地狱中解救了出来,但是如果滥用就会掉进 async/await ...

  7. 【.NET异步编程系列1】:await&async语法糖让异步编程如鱼得水

    前导 Asynchronous programming Model(APM)异步编程模型以BeginMethod(...) 和 EndMethod(...)结对出现. IAsyncResult Beg ...

  8. 使用Typescript写的Vue初学者Hello World实例(实现按需加载、跨域调试、await/async)

    万事开头难,一个好的Hello World程序可以节省我们好多的学习时间,帮助我们快速入门.Hello World程序之所以是入门必读必会,就是因为其代码量少,简单易懂.但我觉得,还应该做到功能丰富, ...

  9. C#.NET使用Task,await,async,异步执行控件耗时事件(event),不阻塞UI线程和不跨线程执行UI更新,以及其他方式比较

    使用Task,await,async,异步执行事件(event),不阻塞UI线程和不跨线程执行UI更新 使用Task,await,async 的异步模式 去执行事件(event) 解决不阻塞UI线程和 ...

  10. Vue + WebPack + Typescript初学者VSCode项目 (按需加载、跨域调试、await/async)

    万事开头难,一个好的Hello World程序可以节省我们好多的学习时间,帮助我们快速入门.Hello World程序之所以是入门必读必会,就是因为其代码量少,简单易懂.但我觉得,还应该做到功能丰富, ...

随机推荐

  1. QTP基本循环正常遍历(代码方式实现)

    0 环境 系统环境:win7 1 操作(正常遍历篇) 1.1 代码前看 systemutil.Run "D:\Program Files (x86)\HP\QuickTest Profess ...

  2. CLOUD信用管理设置

    1.参数设置(管理员账户) 2.客户管理-信用管理设置 3.信用检查规则设置 4.信用档案设置 5.涉及集团公司,母公司与子公司的设置 6.信用档案-对象类型可为客户及集团客户 7.信用特批权限设置 ...

  3. python-django项目基础-haystack&whoosh&jieba_20191124

    全文检索框架和搜索引擎的安装和配置: 安装全文检索框架,pip install django-haystack, 安装搜索引擎,pip install whoosh settings里面配置 1,注册 ...

  4. Kintinuous解析

    版权声明:本文为博主原创文章,未经博主允许不得转载. Kintinuous是Thomas Whelan在National University of Ireland Maynooth读博期间的工作,有 ...

  5. PEAKS|NovoHMM|Nover|DeepNovo|MAYUPercolator|UniprotKB|Swiss-prot|Mascot|SEQUEST|X!Tandem|pFind|MaxQuant|Msconvert|PEPMASS|LC|

    质谱仪: 质谱分析法是先将大分子电离为带电粒子,按质核比分离,由质谱仪识别电信号得到质谱图. Top-down直接得到结果是蛋白. Bottom down使用shutgun方法得到结果是肽段. 由蛋白 ...

  6. ACID原则

    ACID原则是数据库事务正常执行的四个,分别指原子性.一致性.独立性及持久性. 事务的原子性(Atomicity)是指一个事务要么全部执行,要么不执行.也就是说一个事务不可能只执行了一半就停止了.比如 ...

  7. 转:zabbix 2.0.6监控cisco交换机 2950 2960s 3560G

    转自: http://blog.chinaunix.net/uid-24250828-id-3806551.html 想在zabbix 上监控交换机端口的流量,找了两天的模板,包括官方的和网友写的.在 ...

  8. 使用Google BBR加速 VPS

    0X00 预备知识 在使用Google BBR之前,我们首先要了解它是什么. 了解计算机网络的人都知道,在TCP连接中,由于需要维持连接的可靠性,引入了拥塞控制和流量管理的方法.Google BBR就 ...

  9. 接口自动化测试平台 http://120.79.232.23

    接口自动化测试平台 http://120.79.232.23 T Name Latest commit message Commit time .idea 修改自动化用例修改接口时,其他接口信息被删的 ...

  10. swoole I/O 模型

    I/O即Input/Output,输入和输出的意思.在计算机的世界里,涉及到数据交换的地方,比如磁盘.网络等,就需要I/O接口. 通常,I/O是相对的.比如说你打开浏览器,通过网络I/O获取我们网站的 ...