javascript - 为什么 promise 链可以扁平化？

Question

下面的代码包含两种promise链，看起来它们是等价的，但我不明白为什么它们是等价的。我认为它就像 2*(3+4) = 2*3+4，这是不正确的。

// example1
runAsync1()
.then(function(data1){
    return runAsync2()
    .then(function(data2){
        return runAsync3(); 
    })
})
.then(function(data3){
    console.log(data3);
});

// example 2
runAsync1()
.then(function(data1){
    return runAsync2();
}).then(function(data2){
    return runAsync3();  
}).then(function(data3){
    console.log(data3);
});

Answer 1

也许一些大括号可以帮助你更好地理解这一点。 (注意:这与您所做的完全相同，只是返回时有一组额外的大括号)

// example1
runAsync1()
.then(function(data1){
    return (
        runAsync2()
        .then(function(data2){
            return runAsync3(); 
        })
    )
})
.then(function(data3){
    console.log(data3);
});

那么这里发生了什么，

1. .then 在 runAsynch1()
上调用然后在 runAsynch2() 上调用
2. .then，它返回 runAsynch3()(此返回沿着链一直进行)返回)
3. 最后在返回的 runAsynch3() 上调用 .then

如您所见，这与示例 2 中发生的过程完全相同

// example 2
runAsync1()
.then(function(data1){
    return runAsync2();
}).then(function(data2){
    return runAsync3();  
}).then(function(data3){
    console.log(data3);
});