理解javascript承诺；堆叠和链接

我在javascript承诺方面遇到了一些问题，特别是在堆叠链方面

有人能给我解释一下这些不同的实现之间的区别吗（如果有！）

实施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中的“true”）这一事实是否会改变行为？承诺是否要求所有返回的值都是异步承诺以保持行为？

您正在说明链接和分支之间的区别。链接将对多个异步操作进行排序，这样一个操作在前一个操作完成时启动，您可以将任意数量的项目链接到一个接一个的顺序

分支将多个异步操作连接起来，以便在一个触发器操作完成时，所有异步操作都可以同时执行

实现1和3是相同的。他们被锁链锁住了。实现3只使用一个临时变量来链接，而实现1只直接使用

.then（）

中的返回值。执行上没有区别。这些

.then（）

处理程序将以串行方式调用

---

实现2是不同的。它是分支的，而不是链子。因为所有后续的

.then（）

处理程序都连接到完全相同的

serverSidePromiseChain

PromiseChainPromiseChain，所以它们都只等待第一个promise被解析，然后所有后续的异步操作都会同时进行（不像其他两个选项那样是串行的）

---

在理解这一点时，从一个层面深入了解这一承诺是如何起作用的可能会有所帮助

当您这样做时（场景1和场景3）：

发生的情况如下：

解释器获取您的

p

变量，找到

.then（）

方法并调用它

.then（）

方法只存储它传递的回调，然后返回一个新的promise对象。此时它不会调用其回调。这个新的promise对象与原始promise对象及其存储的回调绑定。在双方都满意之前，它不会解决

然后调用新返回的承诺上的第二个

.Then（）

处理程序。同样，该promise上的

.then（）

处理程序只存储

.then（）

回调，它们尚未执行

然后，在将来的某个时候，原来的promise

p

通过它自己的异步操作得到解决。解析后，它会调用它存储的任何

resolve

处理程序。其中一个处理程序将是对上述链中第一个

.then（）

处理程序的回调。如果该回调运行到完成，并且返回nothing或静态值（例如，不返回承诺本身），则它将解析它创建的承诺，以在首次调用

之后返回。解析该承诺后，它将调用上面第二个
.then（）
处理程序安装的解析处理程序，依此类推

执行此操作时（场景2）：

---

这里的one promise

p

存储了来自

.then（）

调用的解析处理程序。当原始承诺

p

被解析时，它将调用这两个

.then（）

处理程序。如果

.then（）

处理程序本身包含异步代码和返回承诺，则这两个异步操作将同时进行（类似并行的行为），而不是按照场景1和场景3中的顺序进行。

实现1和3似乎是等效的

在实现2中，最后3个

.then（）

函数的作用都是相同的。

.then（）

方法返回一个新的承诺。履行承诺的价值不能改变。看见您在实现2中的注释（该响应预期为真）表明您的预期不是这样。否，

响应

将不为真（除非该值来自原始承诺）

让我们试试看。运行以下代码段以查看差异：

函数async（）{return Promise.resolve（“async”）；}
函数async3（）{return Promise.resolve（“async3”）；}
函数async4（）{return Promise.resolve（“async4”）；}
函数实现1（）{
logContainer=document.body.appendChild（document.createElement（“div”））；
console.log（“实现1”）；
承诺链；
serverSidePromiseChain=async（）。然后（函数（响应）{
console.log（'1'，响应）；
返回响应；
}).然后（功能（响应）{
console.log（'2'，响应）；
返回true；
}).然后（功能（响应）{
console.log（'3'，response）；//响应应为'true'
返回async3（）；
}).然后（功能（响应）{
控制台日志（'4'，响应）；
返回async4（）；
});
}
函数实现2（）{
logContainer=document.body.appendChild（document.createElement（“div”））；
console.log（“实现2”）；
承诺链；
serverSidePromiseChain=async（）。然后（函数（响应）{
console.log（'1'，响应）；
返回响应；
});
serverSidePromiseChain.then（函数（响应）{
console.log（'2'，响应）；
返回true；
});
serverSidePromiseChain.then（函数（响应）{
console.log（'3'，response）；//响应应为'true'
返回async3（）；
});
serverSidePromiseChain.then（函数（响应）{
控制台日志（'4'，响应）；
返回async4（）；
});
}
函数实现3（）{
logContainer=document.body.appendChild（document.createElement（“div”））；
console.log（“实现3”）；
承诺链；
serverSidePromiseChain=async（）。然后（函数（响应）{
console.log（'1'，响应）；
返回响应；
});
serverSidePromiseChain=serverSidePromiseChain.then（函数（响应）{
console.log（'2'，响应）；
返回true；
});
serverSidePromiseChain=serverSid
p.then(...).then(...)

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