在 JavaScript 中連結 Promise 時如何存取先前的結果？-js教程-PHP中文網

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

Susan Sarandon

發布： 2024-11-28 10:04:12

原創

588 人瀏覽過

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