JavaScript で Promise を連鎖するときに以前の結果にアクセスするにはどうすればよいですか?-jsチュートリアル-php.cn

JavaScript で Promise を連鎖するときに以前の結果にアクセスするにはどうすればよいですか?

Susan Sarandon

リリース： 2024-11-28 10:04:12

オリジナル

586 人が閲覧しました

How to Access Previous Results When Chaining Promises in JavaScript?

Promise の連鎖と以前の結果の共有

このシナリオでは、一連の HTTP リクエストを作成し、1 つのリクエストからの応答データを渡す必要があります。 Bluebird の Promise.join を使用して次へ。課題は、最初のリクエストからの応答データにアクセスすることにあります。

これを達成するには、いくつかのアプローチのいずれかを使用できます。

オプション 1: 1 つの結果を次へフィードする

このアプローチには、Promise を直接連鎖させ、あるリクエストの結果を入力として次のリクエストに渡します。後続の各 .then() ハンドラーは、最新の結果にのみアクセスできます:

Promise.join(
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload)
).then(function(first, second, third) {
    console.log([first, second, third]);
});

ログイン後にコピー

ただし、このアプローチでは、以前の結果へのアクセスは許可されません。

オプション 2: 割り当て中間結果を上位スコープへ

ここでは、中間結果を上位スコープで宣言された変数に代入します。これにより、後続の .then() ハンドラーで以前のすべての結果にアクセスできるようになります。

var r1, r2, r3;
Promise.join(
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload)
).then(function(result1, result2, result3) {
    r1 = result1;
    r2 = result2;
    r3 = result3;
});

ログイン後にコピー

オプション 3: 結果を 1 つのオブジェクトに蓄積する

このアプローチには、オブジェクトの作成が含まれます。結果が利用可能になったときに結果を蓄積します。各 .then() ハンドラーはその結果をオブジェクトに追加し、以前のすべての結果へのアクセスを許可します。

var results = {};
Promise.join(
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload)
).then(function(result1, result2, result3) {
    results.result1 = result1;
    results.result2 = result2;
    results.result3 = result3;
});

ログイン後にコピー

オプション 4: Promises をネスト

Promise をネストすると、次のことが可能になります。ネストされたすべての前の結果にアクセスするにはスコープ:

Promise.join(
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload),
    callhttp("172.16.28.200", payload)
).then(function(result1) {
    // result1 is available here
    return Promise.join(
        callhttp("172.16.28.200", payload),
        callhttp("172.16.28.200", payload)
    ).then(function(result2) {
        // result1 and result2 are available here
        return Promise.join(
            callhttp("172.16.28.200", payload)
        ).then(function(result3) {
            // result1, result2 and result3 are available here
        });
    });
})

ログイン後にコピー

オプション 5: チェーンを独立した部分に分割する

チェーンの一部が独立して実行できる場合は、チェーンを分割して起動できます。個別に実行し、Promise.all() を使用して結果を収集します:

var p1 = callhttp("172.16.28.200", payload);
var p2 = callhttp("172.16.28.200", payload).then(function(result2) {
    return someAsync(result2);
}).then(function(result2a) {
    return someOtherAsync(result2a);
});
var p3 = callhttp("172.16.28.200", payload).then(function(result3) {
    return someAsync(result3);
});
Promise.all([p1, p2, p3]).then(function(results) {
    // multiple results available in results array
    // that can be processed further here with
    // other promises
});

ログイン後にコピー

オプション6: ES7 での await によるシーケンス

Promise は、非同期操作をシーケンスする方法を提供します。 ES7 では、await を使用してこれらの操作を順序付けし、プロセスを簡素化できます。

async function someFunction() {
    const r1 = await callhttp("172.16.28.200", payload);

    // can use r1 here to formulate second http call
    const r2 = await callhttp("172.16.28.200", payload);

    // can use r1 and r2 here to formulate third http call
    const r3 = await callhttp("172.16.28.200", payload);

    // do some computation that has access to r1, r2 and r3
    return someResult;
}

someFunction().then(result => {
    // process final result here
}).catch(err => {
    // handle error here
});

ログイン後にコピー

各オプションには独自の長所と短所があることに注意してください。アプリケーションの特定の要件に最も適したものを選択してください。

以上がJavaScript で Promise を連鎖するときに以前の結果にアクセスするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。