如何中斷Promise的鏈式調用

Promise的then用起來很方便，通過鏈式調用可以讓代碼看起來更清晰。

let p = new Promise((resolve, reject) => {
  resolve('step1');
});

p.then(data => {
  console.log(data);
  return 'step2';
}).then(data => {
  console.log(data);
  return 'step3';
}).then(data => {
  console.log(data);
  return 'step4';
}).catch(reason => {
  console.log(reason);
}).finally(() => {
  console.log('finished.');
});

對應的結果是：

"step1"
"step2"
"step3"
"finished."  /*return 'step4'后面沒有繼續處理了，所以不會打印*/

 可是，如果我們在處理step2的時候，因為條件滿足了，后面的步驟不需要執行，這時候就需要去中斷后續的調用鏈。

方法一：通過拋出一個異常來終止

let needBreak = true;
let p = new Promise((resolve, reject) => {
  resolve('step1');
});

p.then(data => {
  console.log(data);
  return 'step2';
}).then(data => {
  console.log(data);
  if (needBreak) {
    throw "we need break";
  }
  return 'step3';
}).then(data => {
  console.log(data);
  return 'step4';
}).catch(reason => {
  console.log('got error:', reason);
}).finally(() => {
  console.log('finished.');
});

這時候的輸出就成了這樣：

step1
step2
got error: we need break
finished.

方法二：通過reject來中斷

let needBreak = true;
let p = new Promise((resolve, reject) => {
  resolve('step1');
});

p.then(data => {
  console.log(data);
  return 'step2';
}).then(data => {
  console.log(data);
  if (needBreak) {
    return Promise.reject('break without exception.');
  }
  return 'step3';
}).then(data => {
  console.log(data);
  return 'step4';
}).catch(reason => {
  console.log(reason);
}).finally(() => {
  console.log('finished.');
});

輸出結果：

step1
step2
break without exception.
finished.