ES6 async、await的基本使用方法示例


Posted in Javascript onJune 06, 2020

本文实例讲述了ES6 async、await的基本使用方法。分享给大家供大家参考,具体如下:

async是异步编程的最新标准,我们来看看async如何使用

1.async的简单使用

async function fn () {
 return 'abc'
}
console.log(fn());                    // Promise { 'abc' }
fn().then(res => {
 console.log(res);                    // "abc"
})

async作为关键字放在函数前面,让同步的函数成为异步函数,不关函数里返回什么,打印出还是promise,说明async还是基于promise的,async的异步方式还是比promise更加简单优雅的。

2.await的简单使用

// 这里模拟一个耗时操作
function asyncFunc() {
 return new Promise( resolve => {
  setTimeout(() => {
   resolve(100)
  }, 1000);
 })
}

async function fn () {
 let a = await asyncFunc();
 console.log(a);                    // 100
}

fn()

一秒后打印出了100,async和await搭配使用,await可以接收异步函数,整个过程看上去有点像同步代码,但其实是异步操作。

我们在fn()上加上一行代码

async function fn () {
 let a = await asyncFunc();
 console.log(a);                    // 100
 console.log(200);                    // 200
}

执行上面代码看到两次都是在暂停一秒打印出来的,这说明await的后面如果是promise(耗时操作),它会阻塞整个函数,下面的代码不会执行。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
在一个浏览器里呈现所有浏览器测试结果的前端测试工具的思路
Mar 02 Javascript
javascript复制对象使用说明
Jun 28 Javascript
利用JQuery和JS实现奇偶行背景颜色自定义效果
Nov 19 Javascript
extjs tabpanel限制选项卡数量实现思路及代码
Apr 02 Javascript
$.getJSON在IE下失效的原因分析及解决方法
Jun 16 Javascript
js调试工具console.log()方法查看js代码的执行情况
Aug 08 Javascript
JS实现可调整倒计时间代码分享
Aug 18 Javascript
jquery转盘抽奖功能实现
Nov 13 Javascript
React中ES5与ES6写法的区别总结
Apr 21 Javascript
vue3.0 CLI - 2.2 - 组件 home.vue 的初步改造
Sep 14 Javascript
no-vnc和node.js实现web远程桌面的完整步骤
Aug 11 Javascript
vue 开发之路由配置方法详解
Dec 02 Javascript
JS 数组和对象的深拷贝操作示例
Jun 06 #Javascript
ES6 Generator基本使用方法示例
Jun 06 #Javascript
jquery.validate自定义验证用法实例分析【成功提示与择要提示】
Jun 06 #jQuery
ES6 Symbol在对象中的作用实例分析
Jun 06 #Javascript
微信小程序多列表渲染数据开关互不影响的实现
Jun 05 #Javascript
浅谈element中InfiniteScroll按需引入的一点注意事项
Jun 05 #Javascript
使用JavaScript实现网页秒表功能(含开始、暂停、继续、重置功能)
Jun 05 #Javascript
You might like
第七节 类的静态成员 [7]
2006/10/09 PHP
利用PHP制作简单的内容采集器的原理分析
2008/10/01 PHP
非常不错的一个javascript 类
2006/11/07 Javascript
javascript 禁止复制网页
2009/06/11 Javascript
extjs 列表框(multiselect)的动态添加列表项的方法
2009/07/31 Javascript
JS 类型转换常见方法小结
2010/05/31 Javascript
jquery多行滚动/向左或向上滚动/响应鼠标实现思路及代码
2013/01/23 Javascript
js为空或不是对象问题的快速解决方法
2013/12/11 Javascript
JavaScript设计模式之抽象工厂模式介绍
2014/12/28 Javascript
JS+CSS实现的蓝色table选项卡效果
2015/10/08 Javascript
javascript实现五星评分功能
2015/11/10 Javascript
基于Jquery制作图片文字排版预览效果附源码下载
2015/11/18 Javascript
基于Jquery和CSS3制作数字时钟附源码下载(CSS3篇)
2015/11/24 Javascript
详解前端构建工具gulpjs的使用介绍及技巧
2017/01/19 Javascript
jquery实现放大镜简洁代码(推荐)
2017/06/08 jQuery
基于JavaScript实现表格滚动分页
2017/11/22 Javascript
vue项目关闭eslint校验
2018/03/21 Javascript
JS数据类型STRING使用实例解析
2019/12/18 Javascript
javascript中的相等操作符(==与===区别)
2019/12/21 Javascript
[01:13]2014DOTA2西雅图邀请赛 舌尖上的TI4
2014/07/08 DOTA
Python实现windows下模拟按键和鼠标点击的方法
2015/03/13 Python
使用Python编写类UNIX系统的命令行工具的教程
2015/04/15 Python
利用python将xml文件解析成html文件的实现方法
2017/12/22 Python
浅谈对python中if、elif、else的误解
2020/08/20 Python
python基于exchange函数发送邮件过程详解
2020/11/06 Python
广告设计专业自荐信范文
2013/11/14 职场文书
迷你西餐厅创业计划书范文
2013/12/31 职场文书
幼儿园春游活动方案
2014/01/19 职场文书
会议主持词
2014/03/17 职场文书
事业单位鉴定材料
2014/05/25 职场文书
沙滩主题婚礼活动策划方案
2014/09/15 职场文书
陕西导游词
2015/02/04 职场文书
酒店收银员岗位职责
2015/04/07 职场文书
人事任命通知书
2015/04/21 职场文书
2015年家长学校工作总结
2015/04/22 职场文书
复试通知单模板
2015/04/24 职场文书