首頁 > web前端 > js教程 > 在 JavaScript 中連結 Promise 時如何存取先前的結果?

在 JavaScript 中連結 Promise 時如何存取先前的結果?

Susan Sarandon
發布: 2024-11-28 10:04:12
原創
528 人瀏覽過

How to Access Previous Results When Chaining Promises in JavaScript?

連結Promise 並分享先前的結果

在這種情況下,您需要發出一系列HTTP 請求,傳遞一個請求的回應數據使用Bluebird 的Promise.join 進行下一步。挑戰在於存取第一個請求的回應資料。

要實現這一點,您可以採用以下幾種方法之一:

選項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:在一個物件中累積結果

此方法涉及創建一個物件累積可用的結果。每個.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:使用 wait 進行排序ES7

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中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板