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 相关文章推荐
PPK 谈 JavaScript 的 this 关键字 [翻译]
Sep 29 Javascript
JS获取并操作iframe中元素的方法
Mar 21 Javascript
js模仿windows桌面图标排列算法具体实现(附图)
Jun 16 Javascript
javascript中取前n天日期的两种方法分享
Jan 26 Javascript
对Web开发中前端框架与前端类库的一些思考
Mar 27 Javascript
Bootstrap如何激活导航状态
Mar 22 Javascript
vuejs数据超出单行显示更多,点击展开剩余数据实例
May 05 Javascript
JQuery获取元素尺寸、位置及页面滚动事件应用示例
May 14 jQuery
关于vue路由缓存清除在main.js中的设置
Nov 06 Javascript
微信浏览器左上角返回按钮监听的实现
Mar 04 Javascript
VUE : vue-cli中去掉路由中的井号#操作
Sep 04 Javascript
vue render函数动态加载img的src路径操作
Oct 26 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
判“新”函数:得到今天与明天的秒数
2006/10/09 PHP
非常实用的php弹出错误警告函数扩展性强
2014/01/17 PHP
yii2分页之实现跳转到具体某页的实例代码
2016/06/02 PHP
PHP+Ajax实现上传文件进度条动态显示进度功能
2018/06/04 PHP
PHP使用openssl扩展实现加解密方法示例
2020/02/20 PHP
jQuery判断元素是否是隐藏的代码
2011/04/24 Javascript
利用Javascript判断操作系统的类型实现不同操作系统下的兼容性
2013/01/29 Javascript
JavaScript实现网页图片等比例缩放实现代码及调用方式
2013/02/25 Javascript
js实现从右向左缓缓浮出网页浮动层广告的方法
2015/05/09 Javascript
Jquery实现弹性滑块滑动选择数值插件
2015/08/08 Javascript
微信小程序 for 循环详解
2016/10/09 Javascript
jQuery中的select操作详解
2016/11/29 Javascript
JS实现动态修改table及合并单元格的方法示例
2017/02/20 Javascript
JS中this的指向以及call、apply的作用
2018/05/06 Javascript
AngularJS实现的base64编码与解码功能示例
2018/05/17 Javascript
vue 标签属性数据绑定和拼接的实现方法
2018/05/17 Javascript
jQuery实现图片上传预览效果功能完整实例【测试可用】
2018/05/28 jQuery
Angular设置别名alias的方法
2018/11/08 Javascript
详解javascript replace高级用法
2019/02/17 Javascript
使用React手写一个对话框或模态框的方法示例
2019/04/25 Javascript
SSM+layUI 根据登录信息显示不同的页面方法
2019/09/20 Javascript
Python编程之字符串模板(Template)用法实例分析
2017/07/22 Python
java中两个byte数组实现合并的示例
2018/05/09 Python
python3实现域名查询和whois查询功能
2018/06/21 Python
详解关于Django中ORM数据库迁移的配置
2018/10/08 Python
python数据预处理之数据标准化的几种处理方式
2019/07/17 Python
Python中turtle库的使用实例
2019/09/09 Python
解决TensorFlow调用Keras库函数存在的问题
2020/07/06 Python
俄罗斯街头服装品牌:Black Star Wear
2017/03/01 全球购物
枚举与#define宏的区别
2014/04/30 面试题
幼儿园清明节活动总结
2014/07/04 职场文书
2015年维修电工工作总结
2015/04/25 职场文书
护理工作心得体会
2016/01/22 职场文书
基于flask实现五子棋小游戏
2021/05/25 Python
Django Paginator分页器的使用示例
2021/06/23 Python
MySQL定时备份数据库(全库备份)的实现
2021/09/25 MySQL