将基于回调的异步函数转换为基于Promise的函数

JavaScriptJavaScriptBeginner
立即练习

💡 本教程由 AI 辅助翻译自英文原版。如需查看原文,您可以 切换至英文原版

简介

在这个项目中,你将学习如何在JavaScript中把基于回调的异步函数转换为基于Promise的函数。具体来说,你将把Node.js中fs模块里基于回调的readFile函数转换为基于Promise的版本。

🎯 任务

在这个项目中,你将学习:

  • 如何确定将函数转换为基于Promise的函数的条件
  • 如何实现一个promisefy函数来包装基于回调的函数并返回一个Promise
  • 如何使用基于Promise的readFile函数异步读取文件

🏆 成果

完成这个项目后,你将能够:

  • 理解使用Promise而非基于回调的异步编程的好处
  • 实现一个通用的promisefy函数,将基于回调的函数转换为基于Promise的函数
  • 在自己的项目中使用基于Promise的异步函数,以提高代码的可读性和错误处理能力

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("`JavaScript`")) -.-> javascript/BasicConceptsGroup(["`Basic Concepts`"]) javascript(("`JavaScript`")) -.-> javascript/AdvancedConceptsGroup(["`Advanced Concepts`"]) javascript/BasicConceptsGroup -.-> javascript/functions("`Functions`") javascript/AdvancedConceptsGroup -.-> javascript/async_prog("`Asynchronous Programming`") javascript/AdvancedConceptsGroup -.-> javascript/error_handle("`Error Handling`") subgraph Lab Skills javascript/functions -.-> lab-445680{{"`将基于回调的异步函数转换为基于Promise的函数`"}} javascript/async_prog -.-> lab-445680{{"`将基于回调的异步函数转换为基于Promise的函数`"}} javascript/error_handle -.-> lab-445680{{"`将基于回调的异步函数转换为基于Promise的函数`"}} end

将 readFile 函数转换为基于 Promise 的函数

在这一步中,你将学习如何把Node.js中fs模块里的readFile函数转换为基于Promise的函数。按照以下步骤完成这一步:

  1. 在你的代码编辑器中打开index.js文件。
  2. 在文件顶部引入必要的模块:
const fs = require("fs");
const path = require("path");
  1. 定义test-promisefy.json文件的文件路径:
const textPath = path.join(__dirname, "/test-promisefy.json");
  1. 实现promisefy函数:
const promisefy = (fn) => {
  return (textPath, type) => {
    return new Promise((resolve, reject) => {
      fn(textPath, type, (err, contrast) => {
        if (err) {
          reject(err);
        } else {
          resolve(contrast);
        }
      });
    });
  };
};

promisefy函数接受一个基于回调的函数fn作为参数,并返回一个新的函数,该函数返回一个Promise。返回的函数调用原始的fn函数,并用结果解析Promise,或者用错误拒绝它。

  1. 使用promisefy函数创建一个基于Promise的readFile函数版本:
const readFileSync = promisefy(fs.readFile);

现在,你可以使用readFileSync函数通过Promise异步读取test-promisefy.json文件。

使用基于Promise的readFile函数读取文件

在这一步中,你将学习如何使用基于Promise的readFileSync函数来读取test-promisefy.json文件。

  1. 将以下代码添加到index.js文件中:
fs.readFile(textPath, "utf8", (err, contrast) => {
  const readFileSync = promisefy(fs.readFile);

  readFileSync(textPath, "utf8")
    .then((res) => {
      console.log(res === contrast); // 这里预期的结果是:true,即Promise返回的内容与之前读取的相同。
    })
    .catch((err) => {});
});

这段代码使用文件路径和编码调用readFileSync函数,然后使用thencatch方法处理Promise的成功和失败情况。

  1. 现在,你的index.js文件应该如下所示:
const fs = require("fs");
const path = require("path");
const textPath = path.join(__dirname, "/test-promisefy.json");

fs.readFile(textPath, "utf8", (err, contrast) => {
  const readFileSync = promisefy(fs.readFile);

  readFileSync(textPath, "utf8")
    .then((res) => {
      console.log(res === contrast); // 这里预期的结果是:true,即Promise返回的内容与之前读取的相同。
    })
    .catch((err) => {});
});

const promisefy = (fn) => {
  return (textPath, type) => {
    return new Promise((resolve, reject) => {
      fn(textPath, type, (err, contrast) => {
        if (err) {
          reject(err);
        } else {
          resolve(contrast);
        }
      });
    });
  };
};

module.exports = promisefy;
  1. 在终端中运行index.js文件:
node index

你应该会看到输出true,这意味着基于Promise的readFile函数返回了与原始基于回调的readFile函数相同的内容。

恭喜!你已经成功地将readFile函数转换为基于Promise的函数,并使用基于Promise的版本读取了文件。

✨ 查看解决方案并练习

总结

恭喜!你已经完成了这个项目。你可以在LabEx中练习更多实验来提升你的技能。

您可能感兴趣的其他 JavaScript 教程