什么是async

async的意思是“异步”,顾名思义就是有关异步操作的关键字,async 是 ES7 才有的,与我们之前说的Promise、Generator有很大的关联。

使用语法:

async function name(param){

param //传递给函数的参数名称

statements //函数体

}

name().then(function(res){

res//异步操作返回的结果

})

async 函数返回一个Promise对象,可以使用then方法添加回调函数。具体实例如下:

async function show(){
return {a:12,b:15}
}
console.log(show())//Promise {<fulfilled>: {…}}
show().then(res=>{
console.log("res",res)
})

什么是await

await关键字存在async函数表达式中,用于等待Promise对象,暂停执行,等到异步操作完成后,恢复async函数的执行并返回解析值。如果把await放在asnyc函数体外,会报语法错误。

使用语法:

asnyc function name(){

returnValue = await expression;

}

expression 是一个Promise对象或一个需要等待的值,针对所跟不同表达式,有两种处理方式:

对于Promise对象,await会阻塞主函数执行,等待Promise对象执行resolve之后,resolve返回值作为await表达式运算结果,然后继续向下执行。

对于非Promise对象,可以是字符串、布尔值、数值以及普通函数等。await直接返回对应的值,而不是等待其执行结果。

await等待Promise对象实例如下:

async function test1(){
console.log("执行")
return new Promise((resolve,reject)=>{
setTimeout(()=>{
console.log("延迟3秒之后返回成功")
resolve({a:'1'})
},3000)
})
}
async function test2(){
let x = await test1()
console.log("x",x)//{a: "1"}
return x
}
test2().then(function(res){
console.log("res",res)//{a: "1"}
})

await 跟 普通函数 实例如下:

function test3(){
console.log("普通函数")
}
async function test4(){
await test3()
console.log("直接执行")
}
test4()

捕获异常

上述的await后跟Promise对象,我们知道Promise有两种状态,resolved() 和 rejected() ,如果Promise对象变为rejected,会如何处理?

function testAwait(){
return Promise.reject("error");
}
async function test1(){
await testAwait();
console.log("test1");//没有打印
}
test1().then(v=>{
console.log(v);
}).catch(e=>{
console.log(e);//"error"
})

从上实例执行结果发现,返回的reject状态被外层的catch捕获,然后终止了后面的执行。但是在有些情况下,即使出错了我们还是继续执行,而不是中断,此时我们借助try...catch捕获内部异常。

function test1(){
return new Promise((resolve,reject)=>{
reject("error")
})
}
async function test2(){
try{
await test1()
}catch(e){
console.log("报错",e)
}
}
test2().then((res)=>{
console.log("执行成功",res) // 打印:执行成功undefined
}).catch(err=>{
console.log('err',err)
})

Generator与async对比:

  • async利用await阻塞原理,代替了Generator的 yield 。
  • async 相比Generator 不需要 run 流程函数,完美地实现了异步流程。

从 Promise 到 Generator , 再到 async ,对于异步编程的解决方案越来越完美,这就是ES6不断发展的魅力所在。

ES6新增语法(七)——async...await的更多相关文章

  1. ECMAScript简介以及es6新增语法

    ECMAScript简介 ECMAScript与JavaScript的关系 ECMAScript是JavaScript语言的国际化标准,JavaScript是ECMAScript的实现.(前者是后者的 ...

  2. ES6新增语法和内置对象(let,const, Array/String/Set 扩展方法(解构赋值,箭头函数,剩余参数))

    1.let ES6中新增的用于声明变量的关键字. let 声明的变量只在所处于的块级有效. 注意:使用 let 关键字声明的变量才具有块级作用域,var 关键字是不具备这个特点的. 1. 防止循环变量 ...

  3. 【ES6新增语法详述】

    目录 1. 变量的定义 let const 2. 模版字符串 3. 数据解构 4. 函数扩展 设置默认值 箭头函数 5. 类的定义 class 6. 对象的单体模式 "@ ES6新增了关于变 ...

  4. ES6新增语法(一)——let、const、var的区别

    ES6简介 ES6是ECMAScript 6.0的简称,是javascript语言的下一代标准,已经在2015年6月正式发布上线.目的就是为了统一javascript的语法标准,可以用来开发大型应用程 ...

  5. 面向对象编程-终结篇 es6新增语法

    各位,各位,终于把js完成了一个段落了,这次的章节一过我还没确定下面要学的内容可能是vue也可能是前后端交互,但无论是哪个都挺兴奋的,因为面临着终于可以做点看得过去的大点的案例项目了,先憋住激动地情绪 ...

  6. ES6 class setTimeout promise async/await 测试Demo

    class Person { async getVersion () { return new Promise((resolve, reject) => { setTimeout(functio ...

  7. es6 | 新增语法 | 总结

    电梯 原文 https://www.jianshu.com/p/5f40c43c6f85 重点: 遍历map结构 正则扩展 at相当于charAt() ,可以识别中文normarize()includ ...

  8. es6新增语法之`${}`

    这是es6中新增的字符串方法 可以配合反单引号完成拼接字符串的功能 1.反单引号怎么打出来?将输入法调整为英文输入法,单击键盘上数字键1左边的按键. 2.用法step1: 定义需要拼接进去的字符串变量 ...

  9. ES6新增语法(四)——面向对象

    ES6中json的2个变化 简写:名字和值相同时,json可以可以简写 let a=12,b=5; let json = { a, b } console.log(json) // { a:12 , ...

随机推荐

  1. YOLO v1到YOLO v4(下)

    YOLO v1到YOLO v4(下) Faster YOLO使用的是GoogleLeNet,比VGG-16快,YOLO完成一次前向过程只用8.52 billion 运算,而VGG-16要30.69bi ...

  2. TVM部署和集成Deploy and Integration

    TVM部署和集成Deploy and Integration 本文包含如何将TVM部署到各种平台以及如何将其与项目集成. 与传统的深度学习框架不同.TVM堆栈分为两个主要组件: TVM编译器,完成所有 ...

  3. 开发平台支持Arm Cortex-M的微控制器上人工智能训练

    开发平台支持Arm Cortex-M的微控制器上人工智能训练 Development platform enables AI training on Arm Cortex-M-based microc ...

  4. 作为一名双非本科毕业的Java程序员,我该如何在日益严重的内卷化中避免被裁?

    前言 对一个 Java 程序员而言,并发编程能否熟练掌握是判断他是不是优秀的重要标准之一.因为并发编程在 Java 语言中最为晦涩的知识点,它涉及内存.CPU.操作系统.编程语言等多方面的基础能力,更 ...

  5. 重新整理 .net core 实践篇—————路由和终结点[二十三]

    前言 简单整理一下路由和终节点. 正文 路由方式主要有两种: 1.路由模板方式 2.RouteAttribute 方式 路由约束: 1.类型约束 2.范围约束 3.正则表达式 4.是否必选 5.自定义 ...

  6. 【NX二次开发】查找部件中的对象 UF_OBJ_cycle_objs_in_part

    返回所有层上指定类型部件中的所有对象,不管它们的当前显示状态如何.这个例程不返回表达式.指定对象.临时(系统创建的)对象或休眠对象.休眠对象指的是从模型中删除的对象例如,如果你混合了一条边,那么这条边 ...

  7. 【SQLite】批处理脚本BAT读取SQLite数据

     批处理读写SQLite数据库.bat:(编码ANSI) @echo off sqlite3 "F:\improve\SQLite\BAT\Test.db" <"F ...

  8. 基于Colab Pro & Google Drive的Kaggle实战

    原文:https://hippocampus-garden.com/kaggle_colab/ 原文标题:How to Kaggle with Colab Pro & Google Drive ...

  9. Nginx为什么快到根本停不下来?

    Nginx 是一个免费的,开源的,高性能的 HTTP 服务器和反向代理,以及 IMAP / POP3 代理服务器. 图片来自 Pexels Nginx 以其高性能,稳定性,丰富的功能,简单的配置和低资 ...

  10. 「10.28」Dove 打扑克(链表)·Cicada 与排序(概率)·Cicada 拿衣服(各种数据结构)

    A. Dove 打扑克 考场思考半天线段树树状数组,没有什么想法 打完暴力后突然想到此题用链表实现会很快. 因为只有$n$堆,所以设最多有$x$个不同的堆数,那么$x\times (x-1)/2==n ...