确保复合承诺中的异步 '.then()' 执行答案

【问题标题】：Ensuring asyncronous '.then()' execution in compound promises确保复合承诺中的异步 '.then()' 执行
【发布时间】：2016-05-31 21:53:51
【问题描述】：

我正在使用 Typescript 编写 JS 承诺。我有一个复合承诺，即返回承诺的承诺我有：

test() {
    addElement("first")
        .then(
            function (val){
                addElement("second");
                console.log("second*);
            })
            .then(
            function (val){
                addElement("third");
                console.log("third*");
            });
}


export function addElement(elementText){
    return new Promise(function(resolve,reject){
        setTimeout(function(){
            resolve();
        }, Math.random() * 2000);
    })
    .then(console.log(elementText));
}

我希望将这些函数打印出来，first, second*, second, third*, third。但是，我得到：

JS：首先 JS：第二个* JS：第三个* JS：第三 JS：第二个

在被调用的 Promise 的 then 完成后，如何让 then 执行？

【问题讨论】：

Promise 会在事件循环的下一次迭代中得到解决，按照设计。
@zerkms 有没有办法只在执行完所有 addElement 逻辑后才执行某些代码？像 onCompletion 事件？
你可以使用 Promise.all() 来计算执行顺序。
首先，将.then(console.log(elementText)); 更改为.then(function() {console.log(elementText)})，这样它不会立即调用，而是在promise 解决时调用。您需要将函数引用传递给.then()。您正在立即执行该函数，然后传递该函数的返回结果 undefined。
How to make compound promises execute asynchronously的可能重复

标签： javascript typescript promise

【解决方案1】：

你没有在then 块中返回你的承诺。如果你不返回承诺，那么then 块将立即return undefined，并且什么都不会等待它。如果您改为返回一个 Promise，则 Promise 链的执行将暂停，直到您返回的 Promise 得到满足。

test() {
    addElement("first")
        .then(
            function (val){
                console.log("second*");
                return addElement("second");
            })
            .then(
            function (val){
                console.log("third*");
                return addElement("third");
            });
}

虽然我个人不认为这是“菜鸟错误”，但您的描述与诺兰劳森的“We have a problem with promises”中的“菜鸟错误#5”相符；继续阅读以获得更深入的解释。

【讨论】：