序章

JavaScriptの多くのプログラムでは、コードは開発者が1行ずつ書き込むときに実行されます。 これは、同期実行と呼ばれます。これは、行が書き込まれた順序で次々に実行されるためです。 ただし、コンピュータに与えるすべての指示にすぐに対応する必要はありません。 たとえば、ネットワークリクエストを送信する場合、コードを実行するプロセスは、データが返されるのを待ってから処理する必要があります。 この場合、ネットワーク要求が完了するのを待っている間に他のコードを実行しなかった場合、時間が無駄になります。 この問題を解決するために、開発者は非同期プログラミングを使用します。このプログラミングでは、コードの行が記述された順序とは異なる順序で実行されます。 非同期プログラミングを使用すると、ネットワーク要求などの長いアクティビティが終了するのを待つ間に、他のコードを実行できます。

JavaScriptコードは、コンピュータープロセス内の単一のスレッドで実行されます。 そのコードはこのスレッドで同期的に処理され、一度に1つの命令のみが実行されます。 したがって、このスレッドで長時間実行されるタスクを実行する場合、タスクが完了するまで残りのコードはすべてブロックされます。 JavaScriptの非同期プログラミング機能を活用することで、この問題を回避するために、実行時間の長いタスクをバックグラウンドスレッドにオフロードできます。 タスクが完了すると、タスクのデータを処理するために必要なコードがメインのシングルスレッドに戻されます。

このチュートリアルでは、JavaScriptが Event Loop の助けを借りて非同期タスクを管理する方法を学習します。これは、別のタスクを待機しながら新しいタスクを完了するJavaScript構造です。 次に、非同期プログラミングを使用して Studio Ghibli API から映画のリストを要求し、データをCSVファイルに保存するプログラムを作成します。 非同期コードは、コールバック、プロミス、および async/await キーワード。

注:この記事の執筆時点では、非同期プログラミングはコールバックのみを使用して実行されなくなりましたが、この廃止されたメソッドを学習することで、JavaScriptコミュニティがpromiseを使用する理由について優れたコンテキストを提供できます。 The async/await キーワードを使用すると、promiseをより冗長な方法で使用できるため、この記事の執筆時点では、JavaScriptで非同期プログラミングを行うための標準的な方法です。

前提条件

  • 開発マシンにインストールされているNode.js。 このチュートリアルでは、バージョン10.17.0を使用します。 これをmacOSまたはUbuntu18.04にインストールするには、Node.jsをインストールしてmacOSにローカル開発環境を作成する方法またはPPAを使用したインストール]セクションの手順に従います。 Ubuntu18.04にNode.jsをインストールする方法。
  • また、プロジェクトへのパッケージのインストールにも精通している必要があります。 npmおよびpackage.jsonでNode.jsモジュールを使用する方法に関するガイドを読んで最新情報を入手してください。
  • 非同期で関数を使用する方法を学ぶ前に、JavaScriptで関数を作成して実行することに慣れていることが重要です。 紹介や復習が必要な場合は、JavaScriptで関数を定義する方法に関するガイドを読むことができます。

イベントループ

JavaScript関数実行の内部動作を研究することから始めましょう。 これがどのように動作するかを理解することで、非同期コードをより慎重に記述できるようになり、将来のコードのトラブルシューティングに役立ちます。

JavaScriptインタープリターがコードを実行すると、呼び出されるすべての関数がJavaScriptの呼び出しスタックに追加されます。 呼び出しスタックはスタックです。これはリストのようなデータ構造であり、アイテムは上部にのみ追加したり、上部から削除したりできます。 スタックは、「後入れ先出し」またはLIFOの原則に従います。 スタックに2つのアイテムを追加すると、最後に追加されたアイテムが最初に削除されます。

コールスタックを使用した例で説明しましょう。 JavaScriptが関数に遭遇した場合 functionA() 呼び出されると、呼び出しスタックに追加されます。 その機能の場合 functionA() 別の関数を呼び出す functionB()、 それから functionB() コールスタックの一番上に追加されます。 JavaScriptが関数の実行を完了すると、その関数は呼び出しスタックから削除されます。 したがって、JavaScriptは実行されます functionB() まず、完了したらスタックから削除してから、の実行を終了します。 functionA() コールスタックから削除します。 これが、内部関数が常に外部関数の前に実行される理由です。

JavaScriptは、ファイルへの書き込みなどの非同期操作に遭遇すると、そのファイルをメモリ内のテーブルに追加します。 このテーブルには、操作、実行が完了するための条件、および操作が完了したときに呼び出される関数が格納されます。 操作が完了すると、JavaScriptは関連する関数をメッセージキューに追加します。 キューは別のリストのようなデータ構造であり、アイテムは下部にのみ追加でき、上部から削除できます。 メッセージキューでは、2つ以上の非同期操作で機能を実行する準備ができている場合、最初に完了した非同期操作の機能が最初に実行対象としてマークされます。

メッセージキュー内の関数は、呼び出しスタックに追加されるのを待っています。 イベントループは、呼び出しスタックが空かどうかをチェックする永続的なプロセスです。 そうである場合、メッセージキューの最初のアイテムがコールスタックに移動されます。 JavaScriptは、コードで解釈する関数呼び出しよりもメッセージキュー内の関数を優先します。 コールスタック、メッセージキュー、およびイベントループの複合効果により、非同期アクティビティを管理しながらJavaScriptコードを処理できます。

イベントループの概要を理解したので、作成した非同期コードがどのように実行されるかがわかりました。 この知識があれば、コールバック、プロミス、および3つの異なるアプローチで非同期コードを作成できるようになります。 async/await.

コールバックを使用した非同期プログラミング

コールバック関数は、引数として別の関数に渡され、他の関数が終了したときに実行される関数です。 コールバックを使用して、非同期操作が完了した後にのみコードが実行されるようにします。

長い間、コールバックは非同期コードを作成するための最も一般的なメカニズムでしたが、コードの読み取りを混乱させる可能性があるため、現在ではほとんど廃止されています。 このステップでは、コールバックを使用した非同期コードの例を記述して、他の戦略の効率の向上を確認するためのベースラインとして使用できるようにします。

別の関数でコールバック関数を使用する方法はたくさんあります。 一般的に、彼らはこの構造を取ります:

function asynchronousFunction([ Function Arguments ], [ Callback Function ]) {
    [ Action ]
}

JavaScriptまたはNode.jsでは、外部関数の最後の引数としてコールバック関数を使用する必要はありませんが、コールバックを識別しやすくするのが一般的な方法です。 JavaScript開発者が無名関数をコールバックとして使用することも一般的です。 匿名関数は、名前なしで作成された関数です。 引数リストの最後に関数が定義されていると、通常ははるかに読みやすくなります。

コールバックを示すために、 StudioGhibliムービーのリストをファイルに書き込むNode.jsモジュールを作成しましょう。 まず、JavaScriptファイルとその出力を保存するフォルダーを作成します。

  1. mkdir ghibliMovies

次に、そのフォルダに入ります。

  1. cd ghibliMovies

まず、 Studio Ghibli API にHTTPリクエストを送信します。これにより、コールバック関数が結果をログに記録します。 これを行うには、コールバックでHTTP応答のデータにアクセスできるようにするライブラリをインストールします。

ターミナルでnpmを初期化して、後でパッケージの参照を取得できるようにします。

  1. npm init -y

次に、requestライブラリをインストールします。

  1. npm i request --save

次に、という新しいファイルを開きます callbackMovies.js のようなテキストエディタで nano:

  1. nano callbackMovies.js

テキストエディタで、次のコードを入力します。 まず、HTTPリクエストを送信します。 request モジュール:

callbackMovies.js
const request = require('request');

request('https://ghibliapi.herokuapp.com/films');

最初の行で、 request npmを介してインストールされたモジュール。 モジュールは、HTTP要求を行うことができる関数を返します。 次に、その関数をに保存します request 絶え間ない。

次に、を使用してHTTPリクエストを作成します request() 関数。 強調表示された変更を追加して、HTTPリクエストからコンソールにデータを出力してみましょう。

callbackMovies.js
const request = require('request');

request('https://ghibliapi.herokuapp.com/films', (error, response, body) => {
    if (error) {
        console.error(`Could not send request to API: ${error.message}`);
        return;
    }

    if (response.statusCode != 200) {
        console.error(`Expected status code 200 but received ${response.statusCode}.`);
        return;
    }

    console.log('Processing our list of movies');
    movies = JSON.parse(body);
    movies.forEach(movie => {
        console.log(`${movie['title']}, ${movie['release_date']}`);
    });
});

私たちが使用するとき request() 関数、それに2つのパラメータを与えます:

  • リクエストしようとしているウェブサイトのURL
  • リクエストの完了後にエラーまたは成功した応答を処理するコールバック関数

コールバック関数には3つの引数があります。 error, response、 と body. HTTPリクエストが完了すると、結果に応じて引数に値が自動的に与えられます。 リクエストの送信に失敗した場合は、 error オブジェクトが含まれますが、 responsebody だろう null. リクエストが正常に行われた場合、HTTP応答はに保存されます response. HTTP応答がデータを返す場合(この例ではJSONを取得します)、データは次のように設定されます。 body.

コールバック関数は、最初にエラーを受け取ったかどうかを確認します。 最初にコールバックのエラーをチェックして、データが欠落した状態でコールバックの実行が続行されないようにすることをお勧めします。 この場合、エラーと関数の実行をログに記録します。 次に、応答のステータスコードを確認します。 私たちのサーバーは常に利用可能であるとは限らず、APIが変更されて、かつては賢明なリクエストが正しくなくなる可能性があります。 ステータスコードが 200、つまりリクエストが「OK」だったということは、私たちの応答が期待どおりであると確信できることを意味します。

最後に、応答本文を解析して Array 各映画をループして、その名前とリリース年を記録します。

ファイルを保存して終了した後、次のコマンドを使用してこのスクリプトを実行します。

  1. node callbackMovies.js

次の出力が得られます。

Output
Castle in the Sky, 1986 Grave of the Fireflies, 1988 My Neighbor Totoro, 1988 Kiki's Delivery Service, 1989 Only Yesterday, 1991 Porco Rosso, 1992 Pom Poko, 1994 Whisper of the Heart, 1995 Princess Mononoke, 1997 My Neighbors the Yamadas, 1999 Spirited Away, 2001 The Cat Returns, 2002 Howl's Moving Castle, 2004 Tales from Earthsea, 2006 Ponyo, 2008 Arrietty, 2010 From Up on Poppy Hill, 2011 The Wind Rises, 2013 The Tale of the Princess Kaguya, 2013 When Marnie Was There, 2014

スタジオジブリの映画が公開された年のリストを無事に受け取りました。 次に、現在ファイルにログインしているムービーリストを書き込んで、このプログラムを完成させましょう。

を更新します callbackMovies.js テキストエディタでファイルを作成して、次の強調表示されたコードを含めます。これにより、ムービーデータを含むCSVファイルが作成されます。

callbackMovies.js
const request = require('request');
const fs = require('fs');

request('https://ghibliapi.herokuapp.com/films', (error, response, body) => {
    if (error) {
        console.error(`Could not send request to API: ${error.message}`);
        return;
    }

    if (response.statusCode != 200) {
        console.error(`Expected status code 200 but received ${response.statusCode}.`);
        return;
    }

    console.log('Processing our list of movies');
    movies = JSON.parse(body);
    let movieList = '';
    movies.forEach(movie => {
        movieList += `${movie['title']}, ${movie['release_date']}\n`;
    });

    fs.writeFile('callbackMovies.csv', movieList, (error) => {
        if (error) {
            console.error(`Could not save the Ghibli movies to a file: ${error}`);
            return;
        }

        console.log('Saved our list of movies to callbackMovies.csv');;
    });
});

強調表示された変更に注目すると、インポートすることがわかります fs モジュール。 このモジュールは、すべてのNode.jsインストールで標準であり、 writeFile() ファイルに非同期的に書き込むことができるメソッド。

データをコンソールに記録する代わりに、文字列変数に追加するようになりました movieList. 次に、 writeFile() の内容を保存するには movieList 新しいファイルへ—callbackMovies.csv. 最後に、へのコールバックを提供します writeFile() 1つの引数を持つ関数: error. これにより、ファイルに書き込めない場合、たとえば、実行しているユーザーが node 上のプロセスにはこれらの権限がありません。

ファイルを保存し、次のコマンドを使用してこのNode.jsプログラムをもう一度実行します。

  1. node callbackMovies.js

あなたの中で ghibliMovies フォルダ、あなたが見るでしょう callbackMovies.csv、次の内容が含まれています。

callbackMovies.csv
Castle in the Sky, 1986
Grave of the Fireflies, 1988
My Neighbor Totoro, 1988
Kiki's Delivery Service, 1989
Only Yesterday, 1991
Porco Rosso, 1992
Pom Poko, 1994
Whisper of the Heart, 1995
Princess Mononoke, 1997
My Neighbors the Yamadas, 1999
Spirited Away, 2001
The Cat Returns, 2002
Howl's Moving Castle, 2004
Tales from Earthsea, 2006
Ponyo, 2008
Arrietty, 2010
From Up on Poppy Hill, 2011
The Wind Rises, 2013
The Tale of the Princess Kaguya, 2013
When Marnie Was There, 2014

HTTPリクエストのコールバックでCSVファイルに書き込むことに注意することが重要です。 コードがコールバック関数に入ると、HTTPリクエストが完了した後にのみファイルに書き込みます。 CSVファイルを書き込んだ後でデータベースと通信したい場合は、のコールバックで呼び出される別の非同期関数を作成します。 writeFile(). 非同期コードが多いほど、より多くのコールバック関数をネストする必要があります。

5つの非同期操作を実行したいとします。各操作は、別の操作が完了したときにのみ実行できます。 これをコーディングすると、次のようになります。

doSomething1(() => {
    doSomething2(() => {
        doSomething3(() => {
            doSomething4(() => {
                doSomething5(() => {
                    // final action
                });
            });
        }); 
    });
});

ネストされたコールバックに実行するコードが多数ある場合、それらは大幅に複雑になり、読み取り不能になります。 JavaScriptプロジェクトのサイズと複雑さが増すにつれて、この効果は、最終的には管理できなくなるまで、より顕著になります。 このため、開発者は非同期操作を処理するためにコールバックを使用しなくなりました。 非同期コードの構文を改善するために、代わりにpromiseを使用できます。

簡潔な非同期プログラミングのためのPromiseの使用

promise は、将来のある時点で値を返すJavaScriptオブジェクトです。 非同期関数は、具象値の代わりにpromiseオブジェクトを返すことができます。 将来価値が出れば、約束は果たされたと言えます。 将来エラーが発生した場合は、約束が拒否されたと言います。 それ以外の場合、Promiseは保留状態で作業中です。

Promiseは通常、次の形式を取ります。

promiseFunction()
    .then([ Callback Function for Fulfilled Promise ])
    .catch([ Callback Function for Rejected Promise ])

このテンプレートに示されているように、promiseはコールバック関数も使用します。 のコールバック関数があります then() 約束が履行されたときに実行されるメソッド。 また、のためのコールバック関数があります catch() promiseの実行中に発生するエラーを処理するメソッド。

代わりにプロミスを使用するようにスタジオジブリプログラムを書き直して、プロミスを直接体験してみましょう。

Axios はJavaScript用のPromiseベースのHTTPクライアントなので、先に進んでインストールしましょう。

  1. npm i axios --save

次に、選択したテキストエディタを使用して、新しいファイルを作成します promiseMovies.js:

  1. nano promiseMovies.js

私たちのプログラムはでHTTPリクエストを行います axios 次に、特別な約束ベースのバージョンを使用します fs 新しいCSVファイルに保存します。

このコードを入力します promiseMovies.js したがって、Axiosをロードして、HTTPリクエストをムービーAPIに送信できます。

promiseMovies.js
const axios = require('axios');

axios.get('https://ghibliapi.herokuapp.com/films');

最初の行で、 axios モジュール、返された関数をと呼ばれる定数に格納します axios. 次に、 axios.get() APIにHTTPリクエストを送信するメソッド。

The axios.get() メソッドはpromiseを返します。 ジブリ映画のリストをコンソールに印刷できるように、その約束を連鎖させましょう。

promiseMovies.js
const axios = require('axios');
const fs = require('fs').promises;


axios.get('https://ghibliapi.herokuapp.com/films')
    .then((response) => {
        console.log('Successfully retrieved our list of movies');
        response.data.forEach(movie => {
            console.log(`${movie['title']}, ${movie['release_date']}`);
        });
    })

何が起こっているのかを分析してみましょう。 でHTTPGETリクエストを行った後 axios.get()、使用します then() 関数。promiseが実行されたときにのみ実行されます。 この場合、コールバックの例で行ったように、映画を画面に印刷します。

このプログラムを改善するには、強調表示されたコードを追加して、HTTPデータをファイルに書き込みます。

promiseMovies.js
const axios = require('axios');
const fs = require('fs').promises;


axios.get('https://ghibliapi.herokuapp.com/films')
    .then((response) => {
        console.log('Successfully retrieved our list of movies');
        let movieList = '';
        response.data.forEach(movie => {
            movieList += `${movie['title']}, ${movie['release_date']}\n`;
        });

        return fs.writeFile('promiseMovies.csv', movieList);
    })
    .then(() => {
        console.log('Saved our list of movies to promiseMovies.csv');
    })

さらに、 fs もう一度モジュール。 後の方法に注意してください fs 私たちが持っているインポート .promises. Node.jsには、コールバックベースのpromisedベースのバージョンが含まれています fs ライブラリであるため、レガシープロジェクトで下位互換性が損なわれることはありません。

最初 then() HTTPリクエストを処理する関数が呼び出すようになりました fs.writeFile() コンソールに印刷する代わりに。 のpromiseベースのバージョンをインポートしたので fs、 私たちの writeFile() 関数は別のpromiseを返します。 そのため、別の then() いつのための機能 writeFile() 約束は果たされます。

約束は新しい約束を返すことができ、約束を次々に実行することができます。 これにより、複数の非同期操作を実行するための道が開かれます。 これはpromisechaining と呼ばれ、コールバックのネストに似ています。 二番目 then() ファイルへの書き込みに成功した後にのみ呼び出されます。

注:この例では、コールバックの例のようにHTTPステータスコードをチェックしませんでした。 デフォルトでは、 axios エラーを示すステータスコードを取得した場合、その約束は果たされません。 そのため、検証する必要はありません。

このプログラムを完了するには、約束を catch() 次のように強調表示されているように機能します。

promiseMovies.js
const axios = require('axios');
const fs = require('fs').promises;


axios.get('https://ghibliapi.herokuapp.com/films')
    .then((response) => {
        console.log('Successfully retrieved our list of movies');
        let movieList = '';
        response.data.forEach(movie => {
            movieList += `${movie['title']}, ${movie['release_date']}\n`;
        });

        return fs.writeFile('promiseMovies.csv', movieList);
    })
    .then(() => {
        console.log('Saved our list of movies to promiseMovies.csv');
    })
    .catch((error) => {
        console.error(`Could not save the Ghibli movies to a file: ${error}`);
    });

一連の約束の中で約束が果たされない場合、JavaScriptは自動的に catch() 定義されている場合は関数。 だから私たちは1つしか持っていません catch() 2つの非同期操作がある場合でも、句。

次のコマンドを実行して、プログラムが同じ出力を生成することを確認しましょう。

  1. node promiseMovies.js

あなたの中で ghibliMovies フォルダ、あなたは見るでしょう promiseMovies.csv 含むファイル:

promiseMovies.csv
Castle in the Sky, 1986
Grave of the Fireflies, 1988
My Neighbor Totoro, 1988
Kiki's Delivery Service, 1989
Only Yesterday, 1991
Porco Rosso, 1992
Pom Poko, 1994
Whisper of the Heart, 1995
Princess Mononoke, 1997
My Neighbors the Yamadas, 1999
Spirited Away, 2001
The Cat Returns, 2002
Howl's Moving Castle, 2004
Tales from Earthsea, 2006
Ponyo, 2008
Arrietty, 2010
From Up on Poppy Hill, 2011
The Wind Rises, 2013
The Tale of the Princess Kaguya, 2013
When Marnie Was There, 2014

promiseを使用すると、コールバックのみを使用するよりもはるかに簡潔なコードを記述できます。 コールバックのpromiseチェーンは、コールバックをネストするよりもクリーンなオプションです。 ただし、非同期呼び出しを増やすと、Promiseチェーンが長くなり、維持が難しくなります。

コールバックとpromiseの冗長性は、非同期タスクの結果が得られたときに関数を作成する必要があることに起因します。 より良い経験は、非同期の結果を待って、それを関数の外の変数に入れることです。 そうすれば、関数を作成しなくても、変数の結果を使用できます。 これは、 asyncawait キーワード。

でJavaScriptを書く async/await

The async/await キーワードは、promiseを操作するときに代替構文を提供します。 で利用可能な約束の結果を持つ代わりに then() メソッドの場合、結果は他の関数と同様に値として返されます。 関数を定義します async それがpromiseを返す非同期関数であることをJavaScriptに伝えるためのキーワード。 を使用します await 実行されたときにpromise自体を返すのではなく、promiseの結果を返すようにJavaScriptに指示するキーワード。

一般に、 async/await 使用法は次のようになります。

async function() {
    await [Asynchronous Action]
}

使い方を見てみましょう async/await スタジオジブリプログラムを改善することができます。 テキストエディタを使用して、新しいファイルを作成して開きます asyncAwaitMovies.js:

  1. nano asyncAwaitMovies.js

新しく開いたJavaScriptファイルで、promiseの例で使用したものと同じモジュールをインポートすることから始めましょう。

asyncAwaitMovies.js
const axios = require('axios');
const fs = require('fs').promises;

インポートはと同じです promiseMovies.js なぜなら async/await 約束を使用します。

今、私たちは使用します async 非同期コードで関数を作成するためのキーワード:

asyncAwaitMovies.js
const axios = require('axios');
const fs = require('fs').promises;

async function saveMovies() {}

と呼ばれる新しい関数を作成します saveMovies() しかし、私たちは含まれています async その定義の最初に。 使用できるのは await 非同期関数のキーワード。

使用 await GhibliAPIから映画のリストを取得するHTTPリクエストを作成するキーワード:

asyncAwaitMovies.js
const axios = require('axios');
const fs = require('fs').promises;

async function saveMovies() {
    let response = await axios.get('https://ghibliapi.herokuapp.com/films');
    let movieList = '';
    response.data.forEach(movie => {
        movieList += `${movie['title']}, ${movie['release_date']}\n`;
    });
}

私たちの中で saveMovies() 関数、私たちはでHTTPリクエストを行います axios.get() 以前のように。 今回は、チェーンしません then() 関数。 代わりに、 await 呼び出される前に。 JavaScriptが見たとき await、それは後に関数の残りのコードのみを実行します axios.get() 実行を終了し、 response 変数。 もう1つのコードは、ファイルに書き込めるようにムービーデータを保存します。

映画のデータをファイルに書き込みましょう。

asyncAwaitMovies.js
const axios = require('axios');
const fs = require('fs').promises;

async function saveMovies() {
    let response = await axios.get('https://ghibliapi.herokuapp.com/films');
    let movieList = '';
    response.data.forEach(movie => {
        movieList += `${movie['title']}, ${movie['release_date']}\n`;
    });
    await fs.writeFile('asyncAwaitMovies.csv', movieList);
}

また、 await でファイルに書き込むときのキーワード fs.writeFile().

この関数を完了するには、promiseがスローする可能性のあるエラーをキャッチする必要があります。 コードをカプセル化してこれを実行しましょう try/catch ブロック:

asyncAwaitMovies.js
const axios = require('axios');
const fs = require('fs').promises;

async function saveMovies() {
    try {
        let response = await axios.get('https://ghibliapi.herokuapp.com/films');
        let movieList = '';
        response.data.forEach(movie => {
            movieList += `${movie['title']}, ${movie['release_date']}\n`;
        });
        await fs.writeFile('asyncAwaitMovies.csv', movieList);
    } catch (error) {
        console.error(`Could not save the Ghibli movies to a file: ${error}`);
    }
}

promiseは失敗する可能性があるため、非同期コードを try/catch 句。 これにより、HTTPリクエストまたはファイル書き込み操作のいずれかが失敗したときにスローされるエラーがキャプチャされます。

最後に、非同期関数を呼び出しましょう saveMovies() したがって、プログラムを実行すると実行されます node

asyncAwaitMovies.js
const axios = require('axios');
const fs = require('fs').promises;

async function saveMovies() {
    try {
        let response = await axios.get('https://ghibliapi.herokuapp.com/films');
        let movieList = '';
        response.data.forEach(movie => {
            movieList += `${movie['title']}, ${movie['release_date']}\n`;
        });
        await fs.writeFile('asyncAwaitMovies.csv', movieList);
    } catch (error) {
        console.error(`Could not save the Ghibli movies to a file: ${error}`);
    }
}

saveMovies();

一見すると、これは典型的な同期JavaScriptコードブロックのように見えます。 渡される関数が少なく、少しきれいに見えます。 これらの小さな調整により、非同期コードが作成されます async/await メンテナンスが簡単です。

端末にこれを入力して、プログラムのこの反復をテストします。

  1. node asyncAwaitMovies.js

あなたの中で ghibliMovies フォルダ、新しい asyncAwaitMovies.csv ファイルは次の内容で作成されます。

asyncAwaitMovies.csv
Castle in the Sky, 1986
Grave of the Fireflies, 1988
My Neighbor Totoro, 1988
Kiki's Delivery Service, 1989
Only Yesterday, 1991
Porco Rosso, 1992
Pom Poko, 1994
Whisper of the Heart, 1995
Princess Mononoke, 1997
My Neighbors the Yamadas, 1999
Spirited Away, 2001
The Cat Returns, 2002
Howl's Moving Castle, 2004
Tales from Earthsea, 2006
Ponyo, 2008
Arrietty, 2010
From Up on Poppy Hill, 2011
The Wind Rises, 2013
The Tale of the Princess Kaguya, 2013
When Marnie Was There, 2014

これでJavaScript機能を使用しました async/await 非同期コードを管理します。

結論

このチュートリアルでは、JavaScriptが関数の実行とイベントループを使用した非同期操作の管理をどのように処理するかを学びました。 次に、さまざまな非同期プログラミング手法を使用して映画データのHTTP要求を行った後、CSVファイルを作成するプログラムを作成しました。 まず、廃止されたコールバックベースのアプローチを使用しました。 次に、promiseを使用し、最後に async/await promise構文をより簡潔にするため。

Node.jsを使用した非同期コードを理解すると、API呼び出しに依存するプログラムなど、非同期プログラミングの恩恵を受けるプログラムを開発できるようになります。 パブリックAPIのこのリストをご覧ください。 それらを使用するには、このチュートリアルで行ったように非同期HTTPリクエストを作成する必要があります。 さらに詳しく調べるには、これらのAPIを使用して、ここで学習した手法を実践するアプリを作成してみてください。