【JavaScript】--- ES6/ES7/ES8
一、async
async其实是ES7才有有的关键字,async的意思是异步,顾名思义是有关异步的操作
async用于声明一个函数是异步的。
通常情况下async、await都是跟随promise一起使用,因为async返回值都是一个promise对象,async适用于任何类型的函数上
二、基本使用
使用async其实很简单,只需要在函数前面加一个async即可,这个函数的返回值是一个promise
//用来声明一个函数是异步的
async function fn(){
return 123;
} //返回值是一个promise
console.log(fn())
/*
Promise
__proto__: Promise
[[PromiseStatus]]: "resolved"
[[PromiseValue]]: 123 */ //可以通过.then拿到返回值
fn().then((data)=>{
console.log(data);//
})
三、await
await关键字不能够单独使用,必须在async中进行使用
await等待异步执行返回结果后才会执行下面的代码,其实await就是阻止主函数的运行
function fn(){
return new Promise((resolve)=>{
setTimeout(()=>{
console.log(1111);
resolve()
},2000)
})
}
async function fn1(){
await fn();
setTimeout(()=>{
console.log(2222);
},1000)
}
fn1()
四、如何实现多个异步同步执行
function fn(){
return new Promise((resolve)=>{
setTimeout(()=>{
console.log(1111);
resolve()
},3000)
})
}
function fn1(){
return new Promise((resolve)=>{
setTimeout(()=>{
console.log(2222);
resolve()
},2000)
})
}
function fn2(){
return new Promise((resolve)=>{
setTimeout(()=>{
console.log(3333);
resolve()
},1000)
})
}
async function fn3(){
await fn();
await fn1();
await fn2();
}
fn3()
五、总结
async函数完全可以看作多个异步操作,包装成的一个 Promise 对象,而await命令就是内部then命令的语法糖。
因此如果需要实现多个异步同步执行必须每次await后都返回一个新的promise
【JavaScript】--- ES6/ES7/ES8的更多相关文章
- 【前端】【javascript】es6中的遍历器接口Iterator
好久没发文章啦-.-为了证明我还活着,我决定从笔记里面抓一篇还算不乱比较像文章的发出来... 这些笔记是我在学es6的时候断断续续记录的,最近会一份一份整理陆陆续续发出来,顺便也自己再看一遍.我学习e ...
- 【JavaScript】ES6 新语法
function* 声明 function* 声明(function关键字后跟一个星号)定义一个generator(生成器)函数,返回一个Generator对象. 生成器是一种可以从中退出并在之后重新 ...
- 【15】ES6 for Humans: The Latest Standard of JavaScript: ES2015 and Beyond
[15]ES6 for Humans 共148页: 目前看到:已经全部阅读. 亚马逊地址: 魔芋:总结: 我先看的是阮一峰的在线书籍.这本书的内容很多都与之重复的. 居然卖¥463.也是没谁了. ...
- 【javascript】html5中使用canvas编写头像上传截取功能
[javascript]html5中使用canvas编写头像上传截取功能 本人对canvas很是喜欢,于是想仿照新浪微博头像上传功能(前端使用canvas) 本程序目前在谷歌浏览器和火狐浏览器测试可用 ...
- 【JavaScript】出现即使设置了ID也获取不到的可能原因与window.onload
有时候.在JavaScript中.即使设置了ID也有可能出现document.getElementById()获取不到的情况,然后你就開始想document是否写错之类的.事实上根本就不是你的代码的大 ...
- 【JavaScript】我的JavaScript技术总结第一篇——编程细节
遍历数组 for (var i=0, l=arr.length; i<l; i++) 这样写的一个好处就是让每次循环少一步获取数组对象长度的操作,数组长度越长,价值越明显. 判断变量的真假 if ...
- 【JavaScript】下大雪
引用[JavaScript]满天星的代码,稍作修改的结果: function drawStars() { for (i = 1; i < 100; ++i) { ctx.fillText(&qu ...
- 【JavaScript】JavaScript中的replaceAll
JavaScript中是没有replaceAll的.仅仅有replace,replace仅仅能替换字符中的第一个字符.并且这个replace里面不支持正則表達式,以达到replaceAll的目的. 只 ...
- 【JavaScript】Leetcode每日一题-在D天内送包裹的能力
[JavaScript]Leetcode每日一题-在D天内送包裹的能力 [题目描述] 传送带上的包裹必须在 D 天内从一个港口运送到另一个港口. 传送带上的第 i 个包裹的重量为 weights[i] ...
随机推荐
- CDH:cdh5环境mkdir: Permission denied: user=root, access=WRITE, inode="/user":hdfs:hadoop:drwxr-xr-x
产生问题原因: 环境hadoop2,cdh5创建 使用hadoop fs -mdkir /use/xxx创建文件路径时,出现权限问题 前提我们已经把当前用户zhangsan和root放到/etc/su ...
- 未解决:长字符串含…
用reduce拼了一个超长sql语句,大约65000字符,运行通不过,报错: OperationalError: (1054, "Unknown column 'nan' in 'field ...
- JFinal项目部署到Weblogic注意事项
1:修改web.xml配置文件增加以下监听配置 <listener> <listener-class>com.jfinal.ext.kit.ElResolverListener ...
- 利用Xmanager Enterprise 5的passive显示远程linux主机图形化信息
问题描述: 最初的需求是,安装oracle数据(第一次安装都是图形化linxu进去一步步操作,后续发现可以命令静默安装不调用图形化,学习就是步步入深,方得始终),最初实现window弹出linux主机 ...
- zabbix监控k8s出现的pod error status
配置zabbix客户端配置文件 vim /etc/zabbix/zabbix_agentd.conf 添加 Include=/etc/zabbix/zabbix_agentd.d/ #!/bin/b ...
- 查看tar文件的顶层目录
方法一: tar -tf udpSocket.tar | awk -F "/" '{print $1}' | sort | uniq 方法二: tar -tf udpSocket. ...
- 【FTP】FTP服务器的搭建
记录一下FTP服务器的搭建首先打开 程序和功能>打开或关闭Windows功能 进入到Windows功能界面:勾选FTP服务器.然后再在IIS界面,新建一个网站.右键网站,选择“添加到FTP发布” ...
- Linux深入理解Socket异常
在各种网络异常情况的背后,TCP是怎么处理的?又是怎样把处理结果反馈给上层应用的?本文就来讨论这个问题.分为两个场景来讨论 建立连接时的异常情况 1 正常情况下 经过三次握手,客户端连接成功,服务端有 ...
- 译:5.RabbitMQ Java Client 之 Topics (主题)
在 上篇博文 译:4.RabbitMQ 之Routing(路由) 中,我们改进了日志系统. 我们使用的是direct(直接交换),而不是使用只能进行虚拟广播的 fanout(扇出交换) ,并且有可能选 ...
- 物联网架构成长之路(6)-EMQ权限控制
1. 前言 EMQTT属于一个比较小众的开源软件,很多资料不全,很麻烦,很多功能都是靠猜测,还有就是看官方提供的那几个插件,了解. 2. 说明 上一小节的插件 emq_plugin_wunaozai ...