关于 Node.js Promise then 和 return？

Question

我对承诺感到困惑！

我使用Promise then而不返回，如下所示：

new Promise((resolve, reject) => {
    resolve("1");
}).then((v1) => {
    console.log("v1");
    new Promise((resolve, reject) => {
        //Time-consuming operation, for example: get data from database;
        setTimeout(() => {
            resolve(2)
        }, 3000);
    }).then((v11) => {
        console.log("v11");
    })
}).then((v2) => {
    console.log("v2")
});

我得到这个结果v1 v2 v11。然后，我用另一种写法，如下所示：

 new Promise((resolve, reject) => {
    resolve("1");
}).then((v1) => {
    console.log("v1");
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(2)
        }, 3000)
    }).then((v11) => {
        console.log("v11");
    })
}).then((v2) => {
    console.log("v2")
});

我得到另一个结果v1 v11 v2。

也许，还有另一种情况：

new Promise((resolve, reject) => {
resolve("1");
}).then((v1) => {
console.log("v1");
return new Promise((resolve, reject) => {
    setTimeout(() => {resolve(2)}, 3000)
}).then((v11) => {
    console.log("v11");
    return new Promise((resolve, reject) => {
        setTimeout(() => {resolve(2)}, 4000)
    }).then(() => {
        console.log("v12")
    })
})
}).then((v2) => {
console.log("v2")
});

我得到这个结果v1 v11 v12 v2

我无法理解第二个返回， 我想知道为什么会得到这个结果？

Answer 1

如果您实际打印已解决的 Promise 的值而不仅仅是变量的名称，那么会更容易理解控制流：

版本1

new Promise((resolve, reject) => {
    resolve("1");
}).then((v1) => {
    console.log("v1:", v1);
    new Promise((resolve, reject) => {
        //Time-consuming operation, for example: get data from database;
        setTimeout(() => {
            resolve(2)
        }, 3000);
    }).then((v11) => {
        console.log("v11:", v11);
    })
}).then((v2) => {
    console.log("v2:", v2)
});

版本2

new Promise((resolve, reject) => {
    resolve("1");
}).then((v1) => {
    console.log("v1:", v1);
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(2)
        }, 3000)
    }).then((v11) => {
        console.log("v11:", v11);
    })
}).then((v2) => {
    console.log("v2:", v2)
});

版本3

new Promise((resolve, reject) => {
        resolve("1");
}).then((v1) => {
       console.log("v1:", v1);
       return new Promise((resolve, reject) => {
           setTimeout(() => {resolve(2)}, 3000)
       }).then((v11) => {
           console.log("v11:", v11);
           return new Promise((resolve, reject) => {
               setTimeout(() => {resolve(2)}, 4000)
           }).then((v12) => {
              console.log("v12:", v12)
           })
       })
 }).then((v2) => {
      console.log("v2:", v2)
 });

现在您可以看到传递给回调的内容：

结果1

v1: 1
v2: undefined
v11: 2

结果2

v1: 1
v11: 2
v2: undefined

结果3

v1: 1
v11: 2
v12: 2
v2: undefined

解释

正如您所看到的，当在.then()处理程序中您不返回承诺时，它的行为就好像您返回了一个已经解决的带有值的承诺undefined- 就像您这样做一样：

return Promise.resolve(undefined);

因此.then()可以立即调用下一个处理程序。

另一方面，如果您返回尚未解决的 Promise，则.then()不会立即调用下一个处理程序，而是仅在返回的 Promise 得到解决之后调用。

这解释了当您不返回 Promise 时执行顺序会有所不同 - 所发生的情况就好像已为您隐式返回了已解决的 Promise。