详解node Async/Await 更好的异步编程解决方案


Posted in Javascript onMay 10, 2018

一、异步编程的终极解决方案

前几天写过关于 javascript 异步操作的文章《Javascript Promise 详解》. 最近在学习 Puppeteer 的时候又发现另一种异步编程解决方案:Async/Await.

异步操作是 JavaScript 编程的麻烦事,麻烦到一直有人提出各种各样的方案,试图解决这个问题。 从最早的回调函数,到 Promise 对象,再到 Generator 函数,每次都有所改进,但又让人觉得不彻底。 它们都有额外的复杂性,都需要理解抽象的底层运行机制。

在 Async 函数出来之后,有人认为它是异步编程的最终解决方案。因为有了 Async/Await 之后,你根本就不用关心是它是不是异步编程。

二、基本用法

async 函数返回一个 Promise 对象,可以使用 then 方法添加回调函数。 当函数执行的时候,一旦遇到 await 就会先返回,等到触发的异步操作完成,再接着执行函数体内后面的语句。

下面是一个栗子:

var sleep = function (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      resolve();
    }, time);
  })
};

var start = async function () {
  // 在这里使用起来就像同步代码那样直观
  console.log('start');
  await sleep(3000);
  console.log('end');
};

start();

执行上面的代码,你会发现,控制台先输出start,稍等3秒后,输出了end。

三、注意事项

1、await 命令只能用在 async 函数之中,如果用在普通函数,就会报错。

async function dbFuc(db) {
 let docs = [{}, {}, {}];

 // 报错
 docs.forEach(function (doc) {
  await db.post(doc);
 });
}

2、await 表示在这里等待promise返回结果了,再继续执行。

var sleep = function (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      // 返回 ‘ok'
      resolve('ok');
    }, time);
  })
};

var start = async function () {
  let result = await sleep(3000);
  console.log(result); // 收到 ‘ok'
};

3、await 后面跟着的应该是一个promise对象。

如果是同步执行的代码没有必要使用 await 修饰了。

4、await 只能使用在原生语法中,比如在 forEeach 结构中使用 await 是无法正常工作的,必须使用 for 循环的原生语法。

async function dbFuc(db) {
 let docs = [{}, {}, {}];

 // 可能得到错误结果
 docs.forEach(async function (doc) {
  await db.post(doc);
 });
}

如果确实希望多个请求并发执行,可以使用 Promise.all 方法。

async function dbFuc(db) {
 let docs = [{}, {}, {}];
 let promises = docs.map((doc) => db.post(doc));

 let results = await Promise.all(promises);
 console.log(results);
}

四、错误捕获

既然.then(..)不用写了,那么.catch(..)也不用写,可以直接用标准的try catch语法捕捉错误。

var sleep = function (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      // 模拟出错了,返回 ‘error'
      reject('error');
    }, time);
  })
};

var start = async function () {
  try {
    console.log('start');
    await sleep(3000); // 这里得到了一个返回错误
    
    // 所以以下代码不会被执行了
    console.log('end');
  } catch (err) {
    console.log(err); // 这里捕捉到错误 `error`
  }
};

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery实现点击左右按钮图片横向滚动
Apr 11 Javascript
javascript匿名函数实例分析
Nov 18 Javascript
javascript中对变量类型的判断方法
Aug 09 Javascript
JS前端开发判断是否是手机端并跳转操作(小结)
Feb 05 Javascript
小发现之浅谈location.search与location.hash的问题
Jun 23 Javascript
JS+CSS实现网页加载中的动画效果
Oct 27 Javascript
JS中精巧的自动柯里化实现方法
Dec 12 Javascript
JS脚本实现网页自动秒杀点击
Jan 11 Javascript
微信小程序项目实践之主页tab选项实现
Jul 18 Javascript
微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码
Nov 09 Javascript
JavaScript中如何对多维数组(矩阵)去重的实现
Dec 04 Javascript
微信小程序scroll-view不能左右滑动问题的解决方法
Jul 09 Javascript
Javascript Promise用法详解
May 10 #Javascript
jQuery实现模糊查询的方法分析
May 10 #jQuery
async/await地狱该如何避免详解
May 10 #Javascript
Angular4.x通过路由守卫进行路由重定向实现根据条件跳转到相应的页面(推荐)
May 10 #Javascript
JS中的JSON对象的定义和取值实现代码
May 09 #Javascript
js循环map 获取所有的key和value的实现代码(json)
May 09 #Javascript
js合并两个数组生成合并后的key:value数组
May 09 #Javascript
You might like
十天学会php之第六天
2006/10/09 PHP
PHP 文章中的远程图片采集到本地的代码
2009/07/30 PHP
php打造智能化的柱状图程序,用于报表等
2015/06/19 PHP
PHP基于curl实现模拟微信浏览器打开微信链接的方法示例
2019/02/15 PHP
PHP开发API接口签名生成及验证操作示例
2020/05/27 PHP
利用javascript中的call实现继承
2007/01/22 Javascript
javascript 类定义的4种方法
2009/09/12 Javascript
jQuery toggle()设置CSS样式
2009/11/05 Javascript
JS判断数组中是否有重复值得三种实用方法
2013/08/16 Javascript
前端必备神器 Snap.svg 弹动效果
2014/11/10 Javascript
JS获取图片高度宽度的方法分享
2015/04/17 Javascript
AspNet中使用JQuery boxy插件的确认框
2015/05/20 Javascript
jQuery自定义滚动条完整实例
2016/01/08 Javascript
同步文本框内容JS代码实现
2016/08/04 Javascript
JavaScript实现反转字符串的方法详解
2017/04/27 Javascript
jquery动态赋值id与动态取id方法示例
2017/08/21 jQuery
vue中axios的封装问题(简易版拦截,get,post)
2018/06/15 Javascript
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
2018/08/28 jQuery
[01:11]steam端dota2实名认证操作流程视频
2021/03/11 DOTA
python通过BF算法实现关键词匹配的方法
2015/03/13 Python
python实现提取百度搜索结果的方法
2015/05/19 Python
django使用图片延时加载引起后台404错误
2017/04/18 Python
Python实现单词翻译功能
2017/06/06 Python
Python+OpenCV+pyQt5录制双目摄像头视频的实例
2019/06/28 Python
python和node.js生成当前时间戳的示例
2020/09/29 Python
webView加载html图片遇到的问题解决
2019/10/08 HTML / CSS
巴西婴儿用品商店:Bebe Store
2017/11/23 全球购物
英国门把手公司:Door Handle Company
2019/05/12 全球购物
留学生如何写好自荐信
2013/12/27 职场文书
志愿者活动总结
2014/04/28 职场文书
大学生工作自荐书
2014/06/16 职场文书
社团活动总结怎么写
2014/06/30 职场文书
党员对十八届四中全会的期盼思想汇报范文
2014/10/17 职场文书
见习报告格式范文
2014/11/08 职场文书
高中16字霸气押韵班级口号集锦!
2019/06/27 职场文书
python中opencv实现图片文本倾斜校正
2021/06/11 Python