ウェブサイト検索

javascript - 関数の変数を返す前に、どうやってPromiseが終了するのを待ちますか？

私はまだプロミスに苦労していますが、ここでのコミュニティのおかげで少しずつ進歩しています。

私はParseデータベースをクエリする単純なJS関数を持っています。それは結果の配列を返すはずですが、クエリの非同期的な性質（つまりPromiseのため）により、関数は結果の前に返され、未定義の配列が残ってしまいます。

この関数がプロミスの結果を待つようにするにはどうすればいいですか？

こちらが私のコードです：

function resultsByName(name)
{   
    var Card = Parse.Object.extend("Card");
    var query = new Parse.Query(Card);
    query.equalTo("name", name.toString());

    var resultsArray = [];

    var promise = query.find({
               success: function(results) {
               // results is an array of Parse.Object.
                             console.log(results);
                             //resultsArray = results;
                             return results;
               },

               error: function(error) {
               // error is an instance of Parse.Error.
                             console.log("Error");
               }
    });                           

}

回答 #1

`resultsArray` を返す代わりに、結果の配列のためのプロミスを返し、呼び出し箇所で `then` を使います - これには、呼び出し側が関数が非同期の I/O を実行していることを知るという追加の利点があります。JavaScript のコーディングにおける同時実行はそれに基づいており、より広いアイデアを得るためにこの質問を読むと良いかもしれません:

function resultsByName(name)
{   
    var Card = Parse.Object.extend("Card");
    var query = new Parse.Query(Card);
    query.equalTo("name", name.toString());

    var resultsArray = [];

    return query.find({});                           

}

// later
resultsByName("Some Name").then(function(results){
    // access results here by chaining to the returned promise
});

Parseのブログ記事で、クエリでのparse promisesの使用例をさらに見ることができます。

回答 #2

この関数がプロミスの結果を待つようにするには、何をすればいいですか？

async/await を使用する（ECMA6 の一部ではありませんが、2017 年末以降 Chrome、Edge、Firefox、Safari で利用可能、詳細は canIuse を参照）
MDN

    async function waitForPromise() {
        // let result = await any Promise, like:
        let result = await Promise.resolve('this is a sample promise');
    }

コメントにより追加: 非同期関数は常にPromiseを返し、TypeScriptでは次のようになります:

    async function waitForPromise() {
        // let result = await any Promise, like:
        let result: Promise<string> = await Promise.resolve('this is a sample promise');
    }

関連記事