javascript - 在 $q.all 中序列化调用

Question

需求已经改变，我可以完全重构大量代码，或者弄清楚如何在 $q.all Promise 中序列化多个函数。

var serverCalls = [];

_.each(items, function(item) {
    serverCalls.push(processItem(item));
});

return $q.all(serverCalls);

我想知道是否有一种方法可以按顺序而不是并行调用 $q.all 中的函数，而不必大规模重构将它们放在一起的代码。

Answer 1

如果您需要按顺序运行它们，则需要确保将所有结果堆叠起来，以便外界仍然可以获得通常从 返回的结果数组$q.all:

var serverCalls = Promise.resolve();
var results = [];

_.each(items, function(item) {
    // remember, .then() returns a new promise
    serverCalls = serverCalls.then(function() {
        return processItem(item).then(function(result) {
            results.push(result)
        });
    });
});

return serverCalls.then(function () {
    return results;
});

说明

很难向不知道 Promise 工作原理的人解释发生了什么，但我会尽力而为。对于下面的每个代码示例，请尝试将其复制并粘贴到您的控制台。随意玩玩它!!

Promise.resolve() 只是创建一个已解析的 Promise(可选地带有一个值)。这是启动 promise 链的简单方法:

var foo = Promise.resolve(1234);
foo.then(function (result) {
    console.log(result); //-> 1234
});

在then()函数中，您可以返回一个新值。新值将在后续调用 then() 中使用:

var foo = Promise.resolve(1234);
foo.then(function (result) {
    console.log(result); //-> 1234
    return 5678;
}).then(function (result) {
    console.log(result); //-> 5678
    return "BLAGH";
}).then(function (result) {
    console.log(result); //-> BLAGH
    // do not return anything
}).then(function (result) {
    console.log(result); //-> undefined
});

如果您返回一个新的 Promise，那么 Promise 链将等待该 Promise 解决。在我看来，这是 Promise 最酷的部分。将此代码复制到控制台并注意 1000 毫秒后如何打印每个结果。您可以将超时视为 AJAX 请求:

var foo = Promise.resolve(1234);
foo.then(function (result) {
    console.log(result); //-> 1234;
    return new Promise(function(resolve) {
        setTimeout(function() {
            resolve(5678);
        }, 1000);
    });
}).then(function (result) {
    console.log(result); //-> 5678
    return new Promise(function(resolve) {
        setTimeout(function() {
            resolve("BLAGH");
        }, 1000);
    });
}).then(function (result) {
    console.log(result); //-> "BLAGH"
    return new Promise(function(resolve) {
        setTimeout(function() {
            resolve();
        }, 1000);
    });
}).then(function (result) {
    console.log(result); //-> undefined
});