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 prototype属性深入介绍
Nov 27 Javascript
JavaScript转换农历类实现及调用方法
Jan 27 Javascript
jquery.fastLiveFilter.js实现输入自动过滤的方法
Aug 11 Javascript
jQuery调用WebMethod(PageMethod) NET2.0的方法
Apr 15 Javascript
Bootstrap3学习笔记(三)之表格
May 20 Javascript
十大热门的JavaScript框架和库
Mar 21 Javascript
使用mpvue搭建一个初始小程序及项目配置方法
Dec 03 Javascript
Flutter部件内部状态管理小结之实现Vue的v-model功能
Jun 11 Javascript
vue基础知识--axios合并请求和slot
Jun 04 Javascript
js实现翻牌小游戏
Jul 31 Javascript
JS常用跨域方法实现原理解析
Dec 09 Javascript
浅谈JS的原型和原型链
Jun 04 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&amp;&amp;mysql)一
2006/10/09 PHP
PHP中上传多个文件的表单设计例子
2014/11/19 PHP
PHP 读取大文件并显示的简单实例(推荐)
2016/08/12 PHP
ExtJS GTGrid 简单用户管理
2009/07/01 Javascript
jquery的相对父元素和相对文档定位示例代码
2013/08/02 Javascript
node.js中的socket.io入门实例
2014/04/26 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)
2014/11/16 Javascript
JS实现进入页面时渐变背景色的方法
2015/02/25 Javascript
JavaScript获取网页中第一个图片id的方法
2015/04/03 Javascript
有关jquery与DOM节点操作方法和属性记录
2016/04/15 Javascript
BootstrapValidator不触发校验的实现代码
2016/09/28 Javascript
javascript基础知识讲解
2017/01/11 Javascript
微信小程序中子页面向父页面传值实例详解
2017/03/20 Javascript
详解Webpack DLL用法以及功能
2017/07/11 Javascript
从零开始用electron手撸一个截屏工具的示例代码
2018/10/10 Javascript
自定义javascript验证框架示例【附源码下载】
2019/05/31 Javascript
JS三级联动代码格式实例详解
2019/12/30 Javascript
简单了解JavaScript arguement原理及作用
2020/05/28 Javascript
python 借助numpy保存数据为csv格式的实现方法
2018/07/04 Python
修改默认的pip版本为对应python2.7的方法
2018/11/06 Python
在PYQT5中QscrollArea(滚动条)的使用方法
2019/06/14 Python
python监控进程状态,记录重启时间及进程号的实例
2019/07/15 Python
详解使用PyInstaller将Pygame库编写的小游戏程序打包为exe文件
2019/08/23 Python
解决TensorFlow程序无限制占用GPU的方法
2020/06/30 Python
python3:excel操作之读取数据并返回字典 + 写入的案例
2020/09/01 Python
使用Python获取爱奇艺电视剧弹幕数据的示例代码
2021/01/12 Python
深入浅析HTML5中的article和section的区别
2018/05/15 HTML / CSS
ASOS亚洲:ASOS Asia
2018/03/04 全球购物
Haglöfs瑞典官方网站:haglofs火柴棍,欧洲顶级户外品牌
2018/10/18 全球购物
党员批评与自我批评
2014/02/12 职场文书
合作协议书模板
2014/10/10 职场文书
科技活动总结范文
2015/05/11 职场文书
2015年骨干教师工作总结
2015/05/26 职场文书
七年级作文之我的梦想
2019/10/16 职场文书
多属性、多分类MySQL模式设计
2021/04/05 MySQL
CSS实现背景图片全屏铺满自适应的3种方式
2022/07/07 HTML / CSS