es6学习笔记之Async函数的使用示例


Posted in Javascript onMay 11, 2017

前言

异步操作是 JavaScript 编程的麻烦事,麻烦到一直有人提出各种各样的方案,试图解决这个问题。

从最早的回调函数,到 Promise 对象,再到 Generator 函数,每次都有所改进,但又让人觉得不彻底。它们都有额外的复杂性,都需要理解抽象的底层运行机制。

异步I/O不就是读取一个文件吗,干嘛要搞得这么复杂?异步编程的最高境界,就是根本不用关心它是不是异步。

async 函数就是隧道尽头的亮光,很多人认为它是异步操作的终极解决方案。下面就来看看关于async函数的两个栗子:

栗子一:从豆瓣 API 获取数据

var fetchDoubanApi = function() { 
 return new Promise((resolve, reject) => {
 var xhr = new XMLHttpRequest();
 xhr.onreadystatechange = function() {
  if (xhr.readyState === 4) {
  if (xhr.status >= 200 && xhr.status < 300) {
   var response;
   try {
   response = JSON.parse(xhr.responseText);
   } catch (e) {
   reject(e);
   }
   if (response) {
   resolve(response, xhr.status, xhr);
   }
  } else {
   reject(xhr);
  }
  }
 };
 xhr.open('GET', 'https://api.douban.com/v2/user/aisk', true);
 xhr.setRequestHeader("Content-Type", "text/plain");
 xhr.send(data);
 });
};
(async function() {
 try {
 let result = await fetchDoubanApi();
 console.log(result);
 } catch (e) {
 console.log(e);
 }
})();

栗子二:根据电影文件名,自动下载对应的海报

import fs from 'fs';
import path from 'path';
import request from 'request';
var movieDir = __dirname + '/movies',
 exts  = ['.mkv', '.avi', '.mp4', '.rm', '.rmvb', '.wmv'];
// 读取文件列表
var readFiles = function () {
 return new Promise(function (resolve, reject) {
  fs.readdir(movieDir, function (err, files) {
   resolve(files.filter((v) => exts.includes(path.parse(v).ext)));
  });
 });
};
// 获取海报
var getPoster = function (movieName) {
 let url = `https://api.douban.com/v2/movie/search?q=${encodeURI(movieName)}`;
 return new Promise(function (resolve, reject) {
  request({url: url, json: true}, function (error, response, body) {
   if (error) return reject(error);
   resolve(body.subjects[0].images.large);
  })
 });
};
// 保存海报
var savePoster = function (movieName, url) {
 request.get(url).pipe(fs.createWriteStream(path.join(movieDir, movieName + '.jpg')));
};
(async () => {
 let files = await readFiles();
 // await只能使用在原生语法
 for (var file of files) {
  let name = path.parse(file).name;
  console.log(`正在获取【${name}】的海报`);
  savePoster(name, await getPoster(name));
 }
 console.log('=== 获取海报完成 ===');
})();

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
JavaScript学习笔记(十)
Jan 17 Javascript
用JS写的一个TableView控件代码
Jan 23 Javascript
控制页面按钮在后台执行期间不重复提交的JS方法
Jun 24 Javascript
ExtJS4 表格的嵌套 rowExpander应用
May 02 Javascript
Javascript基础教程之switch语句
Jan 18 Javascript
利用jquery实现下拉框的禁用与启用
Dec 07 Javascript
vue.js中引入vuex储存接口数据及调用的详细流程
Dec 14 Javascript
Django+Vue跨域环境配置详解
Jul 06 Javascript
layer弹出层 iframe层去掉滚动条的实例代码
Aug 17 Javascript
js 函数性能比较方法
Aug 24 Javascript
JavaScript中的执行环境和作用域链
Sep 04 Javascript
JavaScript中常用的3种弹出提示框(alert、confirm、prompt)
Nov 10 Javascript
Node.js安装配置图文教程
May 10 #Javascript
使用bootstrap插件实现模态框效果
May 10 #Javascript
详解Vue用axios发送post请求自动set cookie
May 10 #Javascript
Node.js 异步异常的处理与domain模块解析
May 10 #Javascript
基于Node的React图片上传组件实现实例代码
May 10 #Javascript
JavaScript使用ZeroClipboard操作剪切板
May 10 #Javascript
VUE 更好的 ajax 上传处理 axios.js实现代码
May 10 #Javascript
You might like
php创建多级目录代码
2008/06/05 PHP
PHP的可变变量名的使用方法分享
2012/02/05 PHP
header跳转和include包含问题详解
2012/09/08 PHP
解析php时间戳与日期的转换
2013/06/06 PHP
PHP 面向对象程序设计(oop)学习笔记(一) - 抽象类、对象接口、instanceof 和契约式编程
2014/06/12 PHP
php中Snoopy类用法实例
2015/06/19 PHP
PHP Ajax实现无刷新附件上传
2016/08/17 PHP
php如何修改SESSION的生存存储时间的实例代码
2017/07/05 PHP
PHP实现QQ、微信和支付宝三合一收款码实例代码
2018/02/19 PHP
javascript 面向对象思想 附源码
2009/07/07 Javascript
Extjs单独定义各组件的实例代码
2013/06/25 Javascript
Jquery遍历checkbox获取选中项value值的方法
2014/02/13 Javascript
浅谈Javascript中深复制
2014/12/01 Javascript
微信浏览器内置JavaScript对象WeixinJSBridge使用实例
2015/05/25 Javascript
JS检测页面中哪个HTML标签触发点击事件的方法
2016/06/17 Javascript
基于jQuery的AJAX和JSON实现纯html数据模板
2016/08/09 Javascript
js判断出两个字符串最大子串的函数实现方法
2016/11/01 Javascript
Swiper实现轮播图效果
2017/07/03 Javascript
浅谈node.js 命令行工具(cli)
2018/05/10 Javascript
Angular2 自定义表单验证器的实现方法
2018/12/14 Javascript
React降级配置及Ant Design配置详解
2018/12/27 Javascript
vue中的mvvm模式讲解
2019/01/31 Javascript
layui表单验证select下拉框实现验证的方法
2019/09/05 Javascript
解决echarts echarts数据动态更新和dataZoom被重置问题
2020/07/20 Javascript
解决vuecli3中img src 的引入问题
2020/08/04 Javascript
Python编程实现控制cmd命令行显示颜色的方法示例
2017/08/14 Python
python读取文本中数据并转化为DataFrame的实例
2018/04/10 Python
用Python编写一个高效的端口扫描器的方法
2018/12/20 Python
python实现批量nii文件转换为png图像
2019/07/18 Python
PyCharm使用Docker镜像搭建Python开发环境
2019/12/26 Python
Python中import导入不同目录的模块方法详解
2020/02/18 Python
毕业生求职简历的自我评价
2013/10/23 职场文书
小学校园活动策划
2014/01/30 职场文书
文明礼仪演讲稿
2014/05/12 职场文书
培训通知书模板
2015/04/17 职场文书
穆斯林的葬礼读书笔记
2015/06/26 职场文书