在解决原始承诺之前等待嵌套的 JS 承诺完成

Question

我是 Promises 的新手，在解决原始 Promise 之前等待嵌套的 Promise 完成所有执行的概念有点麻烦。

原始代码

function getSomething(text) {
    return new Promise(function (resolve, reject) {
        getElse(text).then(function (items) {
            if (items.length !== 0) {

                /* Stuff here */

                getElseElse(box).then(function (moreItems) {

                    /* Stuff here */

                    return array;
                }.then(function (array) {
                    var promise = new Promise(function (resolve, reject) {
                        /* anotherFunction() is asynchronous */
                        result = anotherFunction(array); <-- Spot 1
                    });
                    promise.then(function () { });
                });

                return resolve(result); <--- Spot 2

            }
            else {
                return resolve(null);
            }
        });
    });
};

更新的代码 - 更好，但仍不能完全按照我的意愿工作。

function getSomething(text) {
    return getElse(text).then(function (items) {
        if (items.length !== 0) {

            /* Stuff here */

            return getElseElse(box).then(function (moreItems) {

                /* Stuff here */

                return array;
            }).then(anotherFunction);

        } else {
            return null;
        }
    });
}

然后，在单个视图页面中，我有这个：

getSomething(text).then(function (result) {
    /* Do something here using result */
    /* But result is undefined and I think still pending */
});

我已经在 Thomas 的帮助下优化了原始函数，但视图内的原始调用似乎在result 制定之前仍在继续。

我希望 getSomething() 完全完成并返回 result，然后再执行视图内的 .then 内的代码。到目前为止，这还没有实现。

我发现了几篇文章指出了我认为Promise.all 的正确方向，但我似乎无法真正了解这些信息，所以我希望有人可以帮助解释我的具体情况情况。

有帮助的帖子是：

1. Promise Chain not waiting for promises to resolve before ending
2. Wait until nested promises resolve
3. Wait for promises inside Promise.all to finish before resolving it

解决方案

Thomas 在标记的答案中解决了原始问题。经过进一步检查，最终问题在anotherFunction() 内部解决。

原来：

function anotherFunction(array) {
    return new Promise(function (resolve, reject) {
        return anotherGet(parcels).then(function (list) {
            /* Do stuff here without a return */
        });
    });
}

固定版本：

function anotherFunction(array) {
    return anotherGet(parcels).then(function (list) {
        /* Do stuff here */
        return list;
    });
}

Answer 1

首先，避免使用 Promise/Deferred 反模式。很少你需要创建自己的 Promise，通常你有一些返回 Promise 的函数；使用它。

其次，为了让外部 Promise 等待一个嵌套的 Promise，您需要将该嵌套的 Promise 返回到外部 Promise。
在 then() 内部返回一个 Promise 将使生成的 Promise 解析为您在内部重新调整的 Promise 的值。

最后，.then(value => value) 或 .then(value => Promise.resolve(someFunction(value))) 之类的东西毫无意义。您对anotherFunction 的包装器基本上只是传递了参数并返回了结果。

因此，您的伪代码应如下所示：

function getSomething(text) {
  return getElse(text).then(function (items) {
    if (items.length !== 0) {
      /* Stuff here */
      return getElseElse(box).then(function (moreItems) {
        /* Stuff here */
        return array;
      }).then(anotherFunction);
    } else {
      return null;
    }
  });
}

Answer 2

基本技巧是确保您的所有 resolve() 调用都在嵌套的 Promise 的 then() 方法内。

类似的东西：

function getSomething(text) {
    return new Promise(function (resolve, reject) {
        getElse(text).then(function (items) {
            if (items.length !== 0) {

                /* Stuff here */

                getElseElse(box).then(function (moreItems) {

                    /* Stuff here */

                    return array;
                }.then(function (array) {
                    var promise = new Promise(function (resolve, reject) {
                        result = anotherFunction(array); <-- Spot 1
                    });
                    promise.then(function () { });

                    resolve(result); <--- Spot 2
                });    
            }
            else {
                resolve(null);
            }
        });
    });
};

如果它需要嵌套在上面的promise.then() 中，只需将其粘贴在那里即可。

另请注意，您不需要返回您的解决方案。打电话给他们。