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

发布时间 - 2026-01-11 01:04:22    点击率:

前言

异步操作是 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('=== 获取海报完成 ===');
})();

总结

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


# es6  # async函数  # async  # class  # JS基于ES6新特性async await进行异步处理操作示例  # 详解ES6之async+await 同步/异步方案  # ES6新特性八:async函数用法实例详解  # es6学习笔记之Async函数基本教程  # ES6的异步操作之promise用法和async函数的具体使用  # ES6中异步对象Promise用法详解  # ES6的Fetch异步请求的实现方法  # 详解ES6 系列之异步处理实战  # 详解ES6中的三种异步解决方案  # ES6 async、await的基本使用方法示例  # 它是  # 都有  # 让人  # 很多人  # 这篇文章  # 就来  # 文件列表  # 但又  # 能使  # 每次都  # 谢谢大家  # 用在  # 再到  # 回调  # 最高境界  # 解决这个问题  # 运行机制  # 要搞  # 各种各样  # 有疑问 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: Windows家庭版如何开启组策略(gpedit.msc)?(安装方法)  JS中页面与页面之间超链接跳转中文乱码问题的解决办法  Laravel如何自定义错误页面(404, 500)?(代码示例)  Laravel如何实现用户角色和权限系统_Laravel角色权限管理机制  Laravel怎么多语言本地化设置_Laravel语言包翻译与Locale动态切换【手册】  Laravel如何编写单元测试和功能测试?(PHPUnit示例)  javascript读取文本节点方法小结  Python结构化数据采集_字段抽取解析【教程】  Laravel Debugbar怎么安装_Laravel调试工具栏配置指南  如何用wdcp快速搭建高效网站?  php json中文编码为null的解决办法  php中::能调用final静态方法吗_final修饰静态方法调用规则【解答】  免费制作统计图的网站有哪些,如何看待现如今年轻人买房难的情况?  百度输入法ai组件怎么删除 百度输入法ai组件移除工具  laravel怎么实现图片的压缩和裁剪_laravel图片压缩与裁剪方法  如何快速重置建站主机并恢复默认配置?  如何在 Python 中将列表项按字母顺序编号(a.、b.、c. …)  Laravel广播系统如何实现实时通信_Laravel Reverb与WebSockets实战教程  如何在阿里云域名上完成建站全流程?  Android中Textview和图片同行显示(文字超出用省略号,图片自动靠右边)  javascript事件捕获机制【深入分析IE和DOM中的事件模型】  成都网站制作公司哪家好,四川省职工服务网是做什么用?  Laravel如何实现图片防盗链功能_Laravel中间件验证Referer来源请求【方案】  微信小程序 scroll-view组件实现列表页实例代码  利用python获取某年中每个月的第一天和最后一天  Laravel与Inertia.js怎么结合_使用Laravel和Inertia构建现代单页应用  济南网站建设制作公司,室内设计网站一般都有哪些功能?  Laravel如何处理表单验证?(Requests代码示例)  高端云建站费用究竟需要多少预算?  高防服务器租用首荐平台,企业级优惠套餐快速部署  使用PHP下载CSS文件中的所有图片【几行代码即可实现】  品牌网站制作公司有哪些,买正品品牌一般去哪个网站买?  Laravel的路由模型绑定怎么用_Laravel Route Model Binding简化控制器逻辑  Laravel怎么返回JSON格式数据_Laravel API资源Response响应格式化【技巧】  邀请函制作网站有哪些,有没有做年会邀请函的网站啊?在线制作,模板很多的那种?  rsync同步时出现rsync: failed to set times on “xxxx”: Operation not permitted  Laravel如何设置定时任务(Cron Job)_Laravel调度器与任务计划配置  iOS发送验证码倒计时应用  Android Socket接口实现即时通讯实例代码  宙斯浏览器视频悬浮窗怎么开启 边看视频边操作其他应用教程  Laravel如何实现用户注册和登录?(Auth脚手架指南)  如何在景安云服务器上绑定域名并配置虚拟主机?  香港代理服务器配置指南:高匿IP选择、跨境加速与SEO优化技巧  JS弹性运动实现方法分析  Laravel怎么实现微信登录_Laravel Socialite第三方登录集成  ChatGPT常用指令模板大全 新手快速上手的万能Prompt合集  湖南网站制作公司,湖南上善若水科技有限公司做什么的?  Zeus浏览器网页版官网入口 宙斯浏览器官网在线通道  如何在IIS中新建站点并配置端口与IP地址?  如何在云主机快速搭建网站站点?