深入浅出ES6教程『async函数』
大家好,本人名叫苏日俪格,大家叫我 (格格) 就好,在上一章节中我们学到了Symbol & generator的用法,下面我们一起来继续学习async函数:
async [ə'zɪŋk]:这个单词看起来很怪异,它的原型是asynchrony,意为异步,一般单词按理说都能把音准读个大概,这个就...
与其同时呢,也有的人看了这个词想到了放在script标签里的异步脚本,但是此async非彼async,这个async是ES2017出来的,也是用来处理异步的,和ES6中的promise类似,nodeJs里面有一个典型的异步操作,下面用三种异步处理方式来读取文件readFile():
- 1、promise来读取文件
// promise.js
const fs = require("fs");
const read = function(fileName){
return new Promise((resolve,reject)=>{
fs.readFile(fileName,(err,data)=>{
if (err) {
reject(err);
} else{
resolve(data);
}
});
});
};
read('1.txt').then(res=>{
console.log(res.toString());
return read('2.txt'); // 返回新的数据,然后输出
}).then(res => {
console.log(res.toString());
return read('3.txt');
}).then(res => {
console.log(res.toString());
});
然后用node来运行该文件,打开命令行(win+r):
因为读取多个文件一般都会作为一个异步来处理,这样就不会阻塞程序的运行,把fs封装成一个Promise对象,然后在下面返回数据输出,例子中的TXT文件可以写自己的数据
- 2、generator函数读取文件
// generator.js
const fs = require("fs");
const read = function(fileName){
return new Promise((resolve,reject)=>{
fs.readFile(fileName,(err,data)=>{
if (err) {
reject(err);
} else{
resolve(data);
}
});
});
};
function * show(){
yield read('1.txt');
yield read('2.txt');
yield read('3.txt');
}
const s = show();
s.next().value.then(res => {
console.log(res.toString());
return s.next().value;
}).then(res => {
console.log(res.toString());
return s.next().value;
}).then(res => {
console.log(res.toString());
});
依然用node运行即可,这种方式代码量又高了不少,和Promise方式特别像,只不过是把读取文件的信息放在了外面,在下面依次手动调用,特别麻烦,下面我们来介绍第三种方式:
- 3、async函数读取文件
const fs = require("fs");
const read = function(fileName){
return new Promise((resolve,reject)=>{
fs.readFile(fileName,(err,data)=>{
if (err) {
reject(err);
} else{
resolve(data);
}
});
});
};
async function readByAsync(){
let a1 = await read('1.txt');
let a2 = await read('2.txt');
let a3 = await read('3.txt');
console.log(a1.toString());
console.log(a2.toString());
console.log(a3.toString());
}
readByAsync();
这个函数和generator函数有些类似,从例子中可以看得出来,async函数在function前面有个async作为标识,意思就是异步函数,里面有个await搭配使用,每到await的地方就是程序需要等待执行后面的程序,语义化很强,下面总结一下async函数的特点:
- 语义化强
- 里面的await只能在async函数中使用
- await后面的语句可以是promise对象、数字、字符串等
- async函数返回的是一个Promsie对象
- await语句后的Promise对象变成reject状态时,那么整个async函数会中断,后面的程序不会继续执行
基于上面的async的特点,我们会用到异常捕获机制,学过java的都知道,java中有异常捕获try...catch...
小白:这个东西是干什么的?
格格:下面让我们来看一下它的概念
try/catch/finally 语句用于处理代码中可能出现的错误信息。
错误可能是语法错误,通常是程序员造成的编码错误或错别字。也 可能是拼写错误或语言中缺少的功能(可能由于浏览器差异)。
try语句允许我们定义在执行时进行错误测试的代码块。
catch 语句允许我们定义当 try 代码块发生错误时,所执行的代码块。
finally 语句在 try 和 catch 之后无论有无异常都会执行。
注意: catch 和 finally 语句都是可选的,但你在使用 try 语句时必须至少使用一个。
提示: 当错误发生时, JavaScript 会停止执行,并生成一个错误信息。使用 throw 语句 来创建自定义消息(抛出异常)。如果你将 throw 和 try 、 catch一起使用,就可以控制程序输出的错误信息。
知道了这个东西是干什么的,那么我们在async中怎么用呢?
const fs = require("fs");
const read = function(fileName){
return new Promise((resolve,reject)=>{
fs.readFile(fileName,(err,data)=>{
if (err) {
reject(err);
} else{
resolve(data);
}
});
});
};
async function readByAsync(){
try{
let a1 = await read('1.txt');
let a2 = await read('2.txt');
let a3 = await read('3.txt');
}catch(e){
//TODO handle the exception
}
console.log(a1);
console.log(a2);
console.log(a3);
}
readByAsync();
大家看完了这个async是不是感觉还挺有用的啊,以后工作中async就会替代generator,原理是Promise,所以说特别好用。
关于async函数我们都已经了然于心,预知Set & Map数据结构如何,请听下回分解 (^∀^)/~~~
作者:苏日俪格
链接:https://www.jianshu.com/p/631f9406c4e0
来源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。
深入浅出ES6教程『async函数』的更多相关文章
- ES6教程-字符串,函数的参数,了解函数的arguments对象,js面向对象,设计模式-单例模式,解构赋值
前言 主要讲解了ES6对字符串的拓展,包括includes,startsWith和endsWith,另外增加了字符串模板. Start includes()是否包含 startsWith()以什么开头 ...
- es6学习笔记-async函数
1 前情摘要 前段时间时间进行项目开发,需求安排不是很合理,导致一直高强度的加班工作,这一个月不是常说的996,简直是936,还好熬过来了.在此期间不是刚学会了es6的promise,在项目有用到pr ...
- ES6中的async函数
一.概述 async 函数是 Generator 函数的语法糖 使用Generator 函数,依次读取两个文件代码如下 var fs = require('fs'); var readFile = f ...
- ES6学习之Async函数
定义:Async函数是一个异步操作函数,本质上,Async函数是Generator函数的语法糖.async函数就是将 Generator 函数的星号(*)替换成async,将yield替换成await ...
- 浅谈ES6中的Async函数
转载地址:https://www.cnblogs.com/sghy/p/7987640.html 定义:Async函数是一个异步操作函数,本质上,Async函数是Generator函数的语法糖.asy ...
- 深入浅出ES6教程模块化
大家好,本人名叫苏日俪格,大家叫我 (格格) 就好,在上一章节中我们学到了Promise的用法,下面我们一起来继续学习模块化: JavaScript本身是不支持模块化的,只不过后来一些社区的大佬制定了 ...
- ES6学习笔记(四)—— async 函数
await 是 async wait 的简写, 是 generator 函数的语法糖. async 函数的特点: async 声明一个方法是异步的,await 则等待这个异步方法执行的完成 async ...
- 『开发技巧』Python音频操作工具PyAudio上手教程
『开发技巧』Python音频操作工具PyAudio上手教程 0.引子 当需要使用Python处理音频数据时,使用python读取与播放声音必不可少,下面介绍一个好用的处理音频PyAudio工具包. ...
- 前端知识点回顾之重点篇——ES6的async函数和module
async函数 ES2017 标准引入了 async 函数,使得异步操作变得更加方便. async 函数是 Generator 函数的语法糖 什么是语法糖? 意指那些没有给计算机语言添加新功能,而只是 ...
随机推荐
- hive介绍及架构设计
hive介绍及架构设计 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 我们知道MapReduce和Spark它们提供了高度抽象的编程接口便于用户编写分布式程序,它们具有极好的扩展性 ...
- 使用virtualbox安装unbuntu开启共享文件夹时遇到的权限问题
在安装完虚拟机之后,开启文件夹共享,发现只能用root进行访问,个人帐号无权限: cust@hqjia-desktop:/media$ ll drwxr-xr-x 4 root root 4096 2 ...
- Spring Boot SockJS应用例子
1.SockJS用javascript实现的socket连接,兼容各种浏览器的WebSocket支持库2.WebSocket是H5的,不支持H5的浏览器没法使用.3.SockJS它提供类似于webso ...
- IDEA实用教程(六)—— 全局设置的两种方式
五. 全局设置的两种方式 在启动界面进入全局设置 在编码界面进入全局设置 本项目配置 上面的这种设置仅对本项目生效,不会对其他项目生效.请特别注意!!!
- Java内存模型中volatile关键字的作用
volatile作用总结: 1. 强制线程从公共内存中取得变量的值,而不是从线程的私有的本地内存中,volatile修饰的变量不具有原子性(修改一个变量的值不能同步). 2. 保证volatile修饰 ...
- 牛客NOIP暑期七天营-普及组1 解题报告
A 对于\(100\%\),直接开个桶统计即可.入门题目. 代码:https://ac.nowcoder.com/acm/contest/view-submission?submissionId=41 ...
- 前端知识总结--2 js部分
1. JavaScript的『预解释』与『变量提升』 先看以下代码输出啥? var a= 1; function f() { console.log(a); var a = 2; } f(); 首先答 ...
- VBS读取txt文档数据查找Excel中单元格数据符合条件的剪切到工作表2中
Dim fso,f,a set oExcel = CreateObject( "Excel.Application" ) oExcel.Visible = false '4) 打开 ...
- 关于redis的持久化策略
Redis的持久化 Redis虽然是基于内存的存储系统,但是它本身是支持内存数据的持久化的,而且提供两种主要的持久化策略:RDB快照和AOF日志. Redis的RDB快照 Redis支持将当前数据的快 ...
- Oracle Replace()函数与translate()函数 替换函数
简要比较: replace 字符串级别的代替 如:SELECT REPLACE('accd','cd','ef') from dual; --> aefd translate 字符级别的代替 如 ...