コールバックベースの非同期関数をプロミスに変換する

JavaScriptJavaScriptBeginner
今すぐ練習

💡 このチュートリアルは英語版からAIによって翻訳されています。原文を確認するには、 ここをクリックしてください

はじめに

このプロジェクトでは、JavaScript でコールバックベースの非同期関数をプロミスに変換する方法を学びます。具体的には、Node.js の fs モジュールにあるコールバックベースの readFile 関数をプロミスベースのバージョンに変換します。

🎯 タスク

このプロジェクトでは、以下を学びます。

  • 関数をプロミスに変換する条件を特定する方法
  • コールバックベースの関数をラップしてプロミスを返す promisefy 関数を実装する方法
  • プロミスベースの readFile 関数を使ってファイルを非同期で読み取る方法

🏆 成果

このプロジェクトを完了すると、以下のことができるようになります。

  • コールバックベースの非同期プログラミングよりもプロミスを使う利点を理解する
  • コールバックベースの関数をプロミスベースの関数に変換する汎用的な promisefy 関数を実装する
  • 独自のプロジェクトでプロミスベースの非同期関数を利用して、コードの読みやすさとエラーハンドリングを向上させる

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{{"コールバックベースの非同期関数をプロミスに変換する"}} javascript/async_prog -.-> lab-445680{{"コールバックベースの非同期関数をプロミスに変換する"}} javascript/error_handle -.-> lab-445680{{"コールバックベースの非同期関数をプロミスに変換する"}} end

readFile 関数をプロミスに変換する

このステップでは、Node.js の fs モジュールの readFile 関数をプロミスに変換する方法を学びます。以下の手順に従ってこのステップを完了しましょう。

  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 関数を使って、readFile 関数のプロミスベースのバージョンを作成します。
const readFileSync = promisefy(fs.readFile);

これで、readFileSync 関数を使って、Promise を使って test-promisefy.json ファイルを非同期で読み取ることができます。

プロミスベースの readFile 関数を使ってファイルを読み取る

このステップでは、プロミスベースの 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、つまりプロミスは前回の読み取りと同じ内容を返します。
    })
    .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、つまりプロミスは前回の読み取りと同じ内容を返します。
    })
    .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 という出力が表示されるはずで、これはプロミスベースの readFile 関数が元のコールバックベースの readFile 関数と同じ内容を返したことを意味します。

おめでとうございます!あなたは成功裏に readFile 関数をプロミスに変換し、プロミスベースのバージョンを使ってファイルを読み取りました。

✨ 解答を確認して練習

まとめ

おめでとうございます!このプロジェクトを完了しました。あなたの技術を向上させるために、LabEx でさらに多くの実験を行って練習してください。