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 相关文章推荐
Node.js实战 建立简单的Web服务器
Mar 08 Javascript
javascript限制文本框输入值类型的方法
May 07 Javascript
jQuery判断指定id的对象是否存在的方法
May 22 Javascript
SpringMVC返回json数据的三种方式
Dec 10 Javascript
星期几的不同脚本写法(推荐)
Jun 01 Javascript
js 获取当前web应用的上下文路径实现方法
Aug 19 Javascript
jQuery基本过滤选择器用法示例
Sep 09 Javascript
Vue中自定义全局组件的实现方法
Dec 08 Javascript
聊聊Vue 中 title 的动态修改问题
Jun 11 Javascript
JS桶排序的简单理解与实现方法示例
Nov 25 Javascript
微信公众号网页分享功能开发的示例代码
May 27 Javascript
vue 数字翻牌器动态加载数据
Apr 20 Vue.js
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
PHP 读取文件内容代码(txt,js等)
2009/12/06 PHP
php var_export与var_dump 输出的不同
2013/08/09 PHP
PHP的压缩函数实现:gzencode、gzdeflate和gzcompress的区别
2016/01/27 PHP
php微信开发之带参数二维码的使用
2016/08/03 PHP
thinkphp 手机号和用户名同时登录
2017/01/20 PHP
windows下的WAMP环境搭建图文教程(推荐)
2017/07/27 PHP
php判断电子邮件是否正确方法
2018/12/04 PHP
Laravel定时任务的每秒执行代码
2019/10/22 PHP
利用div+jquery自定义滚动条样式的2种方法
2013/07/18 Javascript
原生JS可拖动弹窗效果实例代码
2013/11/09 Javascript
javascript面向对象之共享成员属性与方法及prototype关键字用法
2015/01/13 Javascript
检测一个函数是否是JavaScript原生函数的小技巧
2015/03/13 Javascript
AngularJS使用拦截器实现的loading功能完整实例
2017/05/17 Javascript
EL表达式截取字符串的函数说明
2017/09/22 Javascript
vue内置组件transition简单原理图文详解(小结)
2018/07/12 Javascript
vue.js 双层嵌套for遍历的方法详解, 类似php foreach()
2018/09/07 Javascript
浅谈微信小程序flex布局基础
2018/09/10 Javascript
详解Axios 如何取消已发送的请求
2018/10/20 Javascript
vue跳转同一个组件,参数不同,页面接收值只接收一次的解决方法
2019/11/05 Javascript
Javascript实现贪吃蛇小游戏(含详细注释)
2020/10/23 Javascript
[02:22:36]《加油!DOTA》总决赛
2014/09/19 DOTA
python人人网登录应用实例
2014/09/26 Python
简单理解Python中基于生成器的状态机
2015/04/13 Python
浅谈Python中函数的定义及其调用方法
2019/07/19 Python
Python中filter与lambda的结合使用详解
2019/12/24 Python
Pytorch 实现计算分类器准确率(总分类及子分类)
2020/01/18 Python
python 按钮点击关闭窗口的实现
2020/03/04 Python
python 画图 图例自由定义方式
2020/04/17 Python
使用SimpleITK读取和保存NIfTI/DICOM文件实例
2020/07/01 Python
西尔斯百货官网:Sears
2016/09/06 全球购物
测绘工程个人的自我评价
2013/11/10 职场文书
保安的辞职报告怎么写
2014/01/20 职场文书
求职信模板标准格式范文
2014/02/23 职场文书
支行行长竞聘演讲稿
2014/05/15 职场文书
致百米运动员广播稿5篇
2014/10/13 职场文书
大学生旷课检讨书1000字
2015/02/19 职场文书