如何将Node.js中的回调转换为Promise


Posted in Javascript onNovember 10, 2020

前言

在几年前,回调是 JavaScript 中实现执行异步代码的唯一方法。回调本身几乎没有什么问题,最值得注意的是“回调地狱”。

在 ES6 中引入了 Promise 作为这些问题的解决方案。最后通过引入   async/await 关键字来提供更好的体验并提高了可读性。

即使有了新的方法,但是仍然有许多使用回调的原生模块和库。在本文中,我们将讨论如何将 JavaScript 回调转换为 Promise。ES6 的知识将会派上用场,因为我们将会使用 展开操作符之类的功能来简化要做的事情。

什么是回调

回调是一个函数参数,恰好是一个函数本身。虽然我们可以创建任何函数来接受另一个函数,但回调主要用于异步操作。

JavaScript 是一种解释性语言,一次只能处理一行代码。有些任务可能需要很长时间才能完成,例如下载或读取大文件等。JavaScript 将这些运行时间很长的任务转移到浏览器或 Node.js 环境中的其他进程中。这样它就不会阻止其他代码的执行。

通常异步函数会接受回调函数,所以完成之后可以处理其数据。

举个例子,我们将编写一个回调函数,这个函数会在程序成功从硬盘读取文件之后执行。

所以需要准备一个名为 sample.txt 的文本文件,其中包含以下内容:

Hello world from sample.txt

然后写一个简单的 Node.js 脚本来读取文件:

const fs = require('fs');

fs.readFile('./sample.txt', 'utf-8', (err, data) => {
  if (err) {
    // 处理错误
    console.error(err);
     return;
  }
  console.log(data);
});

for (let i = 0; i < 10; i++) {
  console.log(i);
}

运行代码后将会输出:

0
...
8
9
Hello world from sample.txt

如果这段代码,应该在执行回调之前看到 0..9 被输出到控制台。这是因为 JavaScript 的异步管理机制。在读取文件完毕之后,输出文件内容的回调才被调用。

顺便说明一下,回调也可以在同步方法中使用。例如 Array.sort() 会接受一个回调函数,这个函数允许你自定义元素的排序方式。

❝接受回调的函数被称为“高阶函数”。❞

现在我们有了一个更好的回调方法。那么们继续看看什么是 Promise。

什么是 Promise

在 ECMAScript 2015(ES6)中引入了 Promise,用来改善在异步编程方面的体验。顾名思义,JavaScript 对象最终将返回的“值”或“错误”应该是一个 Promise。

一个 Promise 有 3 个状态:

  • Pending(待处理):用来指示异步操作尚未完成的初始状态。
  • Fulfilled(已完成):表示异步操作已成功完成。
  • Rejected(拒绝):表示异步操作失败。

大多数 Promise 最终看起来像这样:

someAsynchronousFunction()
  .then(data => {
    // promise 被完成
    console.log(data);
  })
  .catch(err => {
    // promise 被拒绝
    console.error(err);
  });

Promise 在现代 JavaScript 中非常重要,因为它们与 ECMAScript 2016 中引入的 async/await 关键字一起使用。使用 async / await 就不需要再用回调或 then() 和 catch() 来编写异步代码。

如果要改写前面的例子,应该是这样:

try {
  const data = await someAsynchronousFunction();
} catch(err) {
  // promise 被拒绝
  console.error(err);
}

这看起来很像“一般的”同步 JavaScript。大多数流行的JavaScript库和新项目都把 Promises 与 async/await 关键字放在一起用。

但是,如果你要更新现有的库或遇到旧的代码,则可能会对将基于回调的 API 迁移到基于 Promise 的 API 感兴趣,这样可以改善你的开发体验。

来看一下将回调转换为 Promise 的几种方法。

将回调转换为 Promise

Node.js Promise

大多数在 Node.js 中接受回调的异步函数(例如 fs 模块)有标准的实现方式:把回调作为最后一个参数传递。

例如这是在不指定文本编码的情况下用 fs.readFile() 读取文件的方法:

fs.readFile('./sample.txt', (err, data) => {
  if (err) {
    console.error(err);
     return;
  }
  console.log(data);
});

注意:如果你指定 utf-8 作为编码,那么得到的输出是一个字符串。如果不指定得到的输出是 Buffer 。

另外传给这个函数的回调应接受 Error ,因为它是第一个参数。之后可以有任意数量的输出。

如果你需要转换为 Promise 的函数遵循这些规则,那么可以用 util.promisify ,这是一个原生 Node.js 模块,其中包含对 Promise 的回调。

首先导入ʻutil`模块:

const util = require('util');

然后用 promisify 方法将其转换为 Promise:

const fs = require('fs');
const readFile = util.promisify(fs.readFile);

现在,把新创建的函数用作 promise:

readFile('./sample.txt', 'utf-8')
  .then(data => {
    console.log(data);
  })
  .catch(err => {
    console.log(err);
  });

另外也可以用下面这个示例中给出的 async/await 关键字:

const fs = require('fs');
const util = require('util');

const readFile = util.promisify(fs.readFile);

(async () => {
  try {
    const content = await readFile('./sample.txt', 'utf-8');
    console.log(content);
  } catch (err) {
    console.error(err);
  }
})();

你只能在用 async 创建的函数中使用 await 关键字,这也是为什么要使用函数包装器的原因。函数包装器也被称为立即调用的函数表达式。

如果你的回调不遵循这个特定标准也不用担心。 util.promisify() 函数可让你自定义转换是如何发生的。

注意:Promise 在被引入后不久就开始流行了。Node.js 已经将大部分核心函数从回调转换成了基于 Promise 的API。

如果需要用 Promise 处理文件,可以用 Node.js 附带的库(https://nodejs.org/docs/latest-v10.x/api/fs.html#fs_fs_promises_api)。

现在你已经了解了如何将 Node.js 标准样式回调隐含到 Promise 中。从 Node.js 8 开始,这个模块仅在 Node.js 上可用。如果你用的是浏览器或早期版本版本的 Node,则最好创建自己的基于 Promise 的函数版本。

创建你自己的 Promise

让我们讨论一下怎样把回调转为 util.promisify() 函数的 promise。

思路是创建一个新的包含回调函数的 Promise 对象。如果回调函数返回错误,就拒绝带有该错误的Promise。如果回调函数返回非错误输出,就解决并输出 Promise。

先把回调转换为一个接受固定参数的函数的 promise 开始:

const fs = require('fs');

const readFile = (fileName, encoding) => {
  return new Promise((resolve, reject) => {
    fs.readFile(fileName, encoding, (err, data) => {
      if (err) {
        return reject(err);
      }

      resolve(data);
    });
  });
}

readFile('./sample.txt')
  .then(data => {
    console.log(data);
  })
  .catch(err => {
    console.log(err);
  });

新函数 readFile() 接受了用来读取 fs.readFile() 文件的两个参数。然后创建一个新的 Promise 对象,该对象包装了该函数,并接受回调,在本例中为 fs.readFile() 。

要 reject Promise 而不是返回错误。所以代码中没有立即把数据输出,而是先 resolve 了Promise。然后像以前一样使用基于 Promise 的 readFile() 函数。

接下来看看接受动态数量参数的函数:

const getMaxCustom = (callback, ...args) => {
  let max = -Infinity;

  for (let i of args) {
    if (i > max) {
      max = i;
    }
  }

  callback(max);
}

getMaxCustom((max) => { console.log('Max is ' + max) }, 10, 2, 23, 1, 111, 20);

第一个参数是 callback 参数,这使它在接受回调的函数中有点与众不同。

转换为 promise 的方式和上一个例子一样。创建一个新的 Promise 对象,这个对象包装使用回调的函数。如果遇到错误,就 reject ,当结果出现时将会 resolve 。

我们的 promise 版本如下:

const getMaxPromise = (...args) => {
  return new Promise((resolve) => {
    getMaxCustom((max) => {
      resolve(max);
    }, ...args);
  });
}

getMaxCustom(10, 2, 23, 1, 111, 20)
  .then(max => console.log(max));

在创建 promise 时,不管函数是以非标准方式还是带有许多参数使用回调都无关紧要。我们可以完全控制它的完成方式,并且原理是一样的。

尽管现在回调已成为 JavaScript 中利用异步代码的默认方法,但 Promise 是一种更现代的方法,它更容易使用。如果遇到了使用回调的代码库,那么现在就可以把它转换为 Promise。

在本文中,我们首先学到了如何 在Node.js 中使用 utils.promisfy() 方法将接受回调的函数转换为 Promise。然后,了解了如何创建自己的 Promise 对象,并在对象中包装了无需使用外部库即可接受回调的函数。这样许多旧 JavaScript 代码可以轻松地与现代的代码库和混合在一起。

总结

到此这篇关于如何将Node.js中的回调转换为Promise的文章就介绍到这了,更多相关Node.js的回调转换为Promise内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
jQuery 选择器项目实例分析及实现代码
Dec 28 Javascript
Ajax同步与异步传输的示例代码
Nov 21 Javascript
javascript图片相似度算法实现 js实现直方图和向量算法
Jan 14 Javascript
利用JavaScript检测CPU使用率自己写的
Mar 22 Javascript
JavaScript学习笔记之JS事件对象
Jan 22 Javascript
javascript中html字符串转化为jquery dom对象的方法
Aug 27 Javascript
JavaScipt选取文档元素的方法(推荐)
Aug 05 Javascript
jQuery实现边框动态效果的实例代码
Sep 23 Javascript
vue插件mescroll.js实现移动端上拉加载和下拉刷新
Mar 07 Javascript
ES7之Async/await的使用详解
Mar 28 Javascript
jquery实现购物车基本功能
Oct 25 jQuery
解决vue组件没显示,没起作用,没报错,但该显示的组件没显示问题
Sep 02 Javascript
vue实现动态给id赋值,点击事件获取当前点击的元素的id操作
Nov 09 #Javascript
jquery实现加载更多&quot;转圈圈&quot;效果(示例代码)
Nov 09 #jQuery
夯基础之手撕javascript继承详解
Nov 09 #Javascript
vue实现动态表格提交参数动态生成控件的操作
Nov 09 #Javascript
es5 类与es6中class的区别小结
Nov 09 #Javascript
vue实现标签云效果的示例
Nov 09 #Javascript
写一个Vue loading 插件
Nov 09 #Javascript
You might like
php 结果集的分页实现代码
2009/03/10 PHP
php 数学运算验证码实现代码
2009/10/11 PHP
一个基于PDO的数据库操作类
2011/03/24 PHP
PHP数组 为文章加关键字连接 文章内容自动加链接
2011/12/29 PHP
dedecms中使用php语句指南
2014/11/13 PHP
php使用PDO方法详解
2014/12/27 PHP
PHP排序算法之堆排序(Heap Sort)实例详解
2018/04/21 PHP
JavaScript判断一个URL链接是否有效的实现方法
2011/10/08 Javascript
30个让人兴奋的视差滚动(Parallax Scrolling)效果网站
2012/03/04 Javascript
深入理解JavaScript 闭包究竟是什么
2013/04/12 Javascript
JavaScript 里的类数组对象
2015/04/08 Javascript
网页收藏夹显示ICO图标(代码少)
2015/08/04 Javascript
js捕捉键盘事件和按键键值的方法
2016/10/10 Javascript
JS对象与json字符串相互转换实现方法示例
2018/06/14 Javascript
jQuery简单实现根据日期计算星期几的方法
2019/01/09 jQuery
一步快速解决微信小程序中textarea层级太高遮挡其他组件
2019/03/04 Javascript
使用mixins实现elementUI表单全局验证的解决方法
2019/04/02 Javascript
详解实现一个通用的“划词高亮”在线笔记功能
2019/04/23 Javascript
JavaScript实现图片上传并预览并提交ajax
2019/09/30 Javascript
Vue + ts实现轮播插件的示例
2020/11/10 Javascript
[01:10]为家乡而战!完美世界城市挑战赛全国总决赛花絮
2019/07/25 DOTA
Python 变量类型及命名规则介绍
2013/06/08 Python
python利用urllib实现爬取京东网站商品图片的爬虫实例
2017/08/24 Python
django 在原有表格添加或删除字段的实例
2018/05/27 Python
安装多个版本的TensorFlow的方法步骤
2020/04/21 Python
python函数中将变量名转换成字符串实例
2020/05/11 Python
python 爬虫如何正确的使用cookie
2020/10/27 Python
将一个数的从第5位开始的7个数取出,其余位置0
2016/05/26 面试题
同事吵架检讨书
2014/02/05 职场文书
计算机应用应届生求职信
2014/07/12 职场文书
村干部群众路线整改措施思想汇报
2014/10/12 职场文书
公民授权委托书
2014/10/15 职场文书
党支部意见范文
2015/06/02 职场文书
《吃水不忘挖井人》教学反思
2016/02/22 职场文书
工作报告范文
2019/06/20 职场文书
《蓝鲸的眼睛》读后感5篇
2020/01/15 职场文书