javascript - 了解 javascript promise ；堆栈和链接

Question

我一直在使用 javascript promises 遇到一些问题，尤其是在堆叠链方面。

任何人都可以向我解释这些不同实现之间的区别(如果有的话!)？

实现 1

var serverSidePromiseChain;
serverSidePromiseChain = async().then(function(response) {
    console.log('1', response);
    return response;
}).then(function(response) {
    console.log('2', response);
    return true;
}).then(function(response) {
    console.log('3', response); // response expected to be 'true'
    return async3();
}).then(function(response) {
    console.log('4', response);
    return async4();
})

实现 2

var serverSidePromiseChain;
serverSidePromiseChain = async().then(function(response) {
    console.log('1', response);
    return response;
});

serverSidePromiseChain.then(function(response) {
    console.log('2', response);
    return true;
})
serverSidePromiseChain.then(function(response) {
    console.log('3', response); // response expected to be 'true'
    return async3();
})
serverSidePromiseChain.then(function(response) {
    console.log('4', response);
    return async4();
})

实现 3

var serverSidePromiseChain;
serverSidePromiseChain = async().then(function(response) {
    console.log('1', response);
    return response;
});

serverSidePromiseChain = serverSidePromiseChain.then(function(response) {
    console.log('2', response);
    return true;
})
serverSidePromiseChain = serverSidePromiseChain.then(function(response) {
    console.log('3', response); // response expected to be 'true'
    return async3();
})
serverSidePromiseChain = serverSidePromiseChain.then(function(response) {
    console.log('4', response);
    return async4();
})

链的一部分返回一个值(步骤 2 中的“真”)这一事实是否改变了行为？ promise 是否要求所有返回值都是异步 promise 以保持行为？

Answer 1

您正在说明链接和分支之间的区别。链接将对多个异步操作进行排序，以便一个在前一个完成时开始，您可以链接任意数量的项以一个接一个地排序。

分支连接多个异步操作，以便在一个触发操作完成时同时进行所有操作。

实现1和3是一样的。他们被束缚着。实现 3 只是使用一个临时变量来链接，而实现 1 只是直接使用 .then() 的返回值。执行没有区别。这些 .then() 处理程序将以串行方式调用。

实现 2 不同。它是分支的，而不是链式的。因为所有后续的 .then() 处理程序都附加到完全相同的 serverSidePromiseChain promise ，它们都只等待第一个 promise 被解决，然后所有后续异步操作都是同时在飞行中(不像其他两个选项那样连续)。

---

深入了解它如何与 promises 一起工作可能有助于理解这一点。

当您这样做时(场景 1 和 3):

p.then(...).then(...)

发生的事情如下:

1. 解释器获取您的 p 变量，在其上找到 .then() 方法并调用它。
2. .then() 方法只存储传递给它的回调，然后返回一个新的 promise 对象。它此时不调用其回调。这个新的 promise 对象与原始 promise 对象及其存储的回调相关联。直到双方都满意才会解决。
3. 然后调用新返回的 promise 上的第二个 .then() 处理程序。同样，该 promise 的 .then() 处理程序仅存储 .then() 回调，它们尚未执行。
4. 然后在将来的某个时候，原始 promise p 会通过其自己的异步操作得到解决。当它被解析时，它会调用它存储的任何 resolve 处理程序。其中一个处理程序将是对上述链中第一个 .then() 处理程序的回调。如果该回调运行到完成并返回任何内容或静态值(例如，不返回 promise 本身)，那么它将解决它创建的 promise ，以便在 .then() 第一次出现后返回叫。当该 promise 得到解决时，它将调用上面第二个 .then() 处理程序安装的解析处理程序，依此类推。

当您执行此操作时(场景 2):

p.then();
p.then();

此处的一个 promise p 存储了来自 .then() 调用的解析处理程序。当原始 promise p 得到解决时，它将调用两个 .then() 处理程序。如果 .then() 处理程序本身包含异步代码和返回 promise ，这两个异步操作将同时进行(类似并行的行为)，而不是像场景 1 和场景 3 中那样按顺序进行.