中断或取消Promise链的可行方案

ES6标准引入的异步编程解决方案Promise，能够将层层嵌套的回调转化成扁平的Promise链式调用，优雅地解决了“回调地狱”的问题。
当Promise链中抛出一个错误时，错误信息沿着链路向后传递，直至被捕获。利用这个特性能跳过链中函数的调用，直至链路终点，变相地结束Promise链。

Promise.resolve()
    .then(() => {
        console.log('[onFulfilled_1]');
        throw 'throw on onFulfilled_1';
    })
    .then(() => {  // 中间的函数不会被调用
        console.log('[onFulfilled_2]');
    })
    .catch(err => {
        console.log('[catch]', err);
    });
// => [onFulfilled_1]
// => [catch] throw on onFulfilled_1

然而，若链路中也对错误进行了捕获，则后续的函数可能会继续执行。

Promise.resolve()
    .then(() => {
        console.log('[onFulfilled_1]');
        throw 'throw on onFulfilled_1';
    })
    .then(() => {
        console.log('[onFulfilled_2]');
    }, err => {     // 捕获错误
        console.log('[onRejected_2]', err);
    })
    .then(() => {   // 该函数将被调用
        console.log('[onFulfilled_3]');
    })
    .catch(err => {
        console.log('[catch]', err);
    });
// => [onFulfilled_1]
// => [onRejected_2] throw on onFulfilled_1
// => [onFulfilled_3]

解决方案
Promise的then方法接收两个参数：
Promise.prototype.then(onFulfilled, onRejected)
若onFulfilled或onRejected是一个函数，当函数返回一个新Promise对象时，原Promise对象的状态将跟新对象保持一致，详见Promises/A+标准。
因此，当新对象保持“pending”状态时，原Promise链将会中止执行。

Promise.resolve()
    .then(() => {
        console.log('[onFulfilled_1]');
        return new Promise(()=>{}); // 返回“pending”状态的Promise对象
    })
    .then(() => {                   // 后续的函数不会被调用
        console.log('[onFulfilled_2]');
    })
    .catch(err => {
        console.log('[catch]', err);
    });
// => [onFulfilled_1]

 

主要问题是：链式调用时，想在下层返回resolve的情况下，需要在中途得到某种resolve结果就终止调用链。(PS:下层可能是调用其他人编写模块，比如参数不对，它仍会返回resolve，出现错误才会reject，本身下层Promise 返回reject是可以打断调用链的)

下面有个链式调用Promise的测试函数

const promiseFun = function(param1){
    return new Promise((resolve, reject)=>{
        resolve(param1);
    });
}
const promiseTest = function(param1, param2){
    return new Promise((resolve, reject)=>{
        promiseFun(1).then((number)=>{
            console.info(`fun1 result:${number}`);
            return promiseFun(2);
        }).then((number)=>{
            console.info(`fun2 result:${number}`);
            return promiseFun(3);
        }).then((number)=>{
            console.info(`fun3 result:${number}`);
            return promiseFun(4);
        }).then((number)=>{
            console.info(`fun4 result:${number}`);
        }).catch((err)=>{
            console.info(`promiseTest error:${err}`);
        });
    });        
}
promiseTest('1','2').then((number)=>{
    console.info(`promiseTest:${number}`);
}).catch((err)=>{
    console.info(`promiseTest failed:${err}`);
});

现在遇到的一个问题是，比如我们在fun2时，我们调用reject 想终止该链式调用，但实际的结果是仍然会跑到

console.info(`fun3 result:${number}`)及console.info(`fun4 result:${number}`)。

PS: 这种想法本身就很奇怪，因为我们调用reject 只是影响promiseTest 下创建那个Promise的状态。也就是调用reject后promiseTest 这个函数会触发onRejected状态。而链式Promise调用状态是由下层Promise对象的状态决定。

promiseFun(1).then((number)=>{
            console.info(`fun1 result:${number}`);
            return promiseFun(2);
        }).then((number)=>{
            console.info(`fun2 result:${number}`);
           if(number === 2){
                reject(number)
            }
            else{
                return promiseFun(3);
            }
        }).then((number)=>{
            console.info(`fun3 result:${number}`);
            return promiseFun(4);
        }).then((number)=>{
            console.info(`fun4 result:${number}`);
        }).catch((err)=>{
            console.info(`promiseTest error:${err}`);
        });

2.2 原因
Promise的then方法接收两个参数：
Promise.prototype.then(onFulfilled, onRejected)
若onFulfilled或onRejected是一个函数，当函数返回一个新Promise对象时，原Promise对象的状态将跟新对象保持一致。
来自：https://promisesaplus.com/

解释下原因：
为什么我们链式调用中reject没有作用？
因为reject仅仅改变的是外层包的promiseTest 返回Promise状态。而链式调用的状态是由promiseFun 返回的状态决定， 而在第二个链式调用then时我们调用reject改变了promiseTest 那种Promise的状态进而使promiseTest触发onRejected状态打印 promiseTest failed:${err}，而链式第二个链式调用中本身没做修改链式调用的状态，所以第三个链式继承了第一个链式调用返回的Promise的resolve状态，导致链式调用继续向下运行。

2.3 解决方案
而针对上面的问题，我们想要在resolve的情况下，中断或终止链式调用。
还是基于Promise的特点：原Promise对象的状态将跟新对象保持一致。

我们仅需要在链式调用中，返回一个pending 状态或reject状态的Promise对象即可。后面then 所有resolve（onFulfilled）的处理函数就都不会跑到了。即：

return (new Promise((resolve, reject)=>{}));//返回pending状态
return (new Promise((resolve, reject)=>{reject()}));//返回reject状态 会被最后catch捕获。

在测试代码中就想这样

then((number)=>{
            console.info(`fun2 result:${number}`);
           if(number === 2){、
         return (new Promise((resolve, reject)=>{}));
                reject(number)
            }
            else{
                return promiseFun(3);
}