ネストするPromise

JavaScriptのネストするPromiseで混乱したので、サンプルコード書いて理解しました。その時のコードを貼っておきます。

//
// 引数に1を渡すと成功、それ以外失敗
//
function func1(a) {
  return new Promise((resolve, reject) => {
    if (a === 1) {
      resolve()
    } else {
      reject()
    }
  })
}

//
// func1をネストして呼び出す
//
function main() {
  func1(1).then(() => {
    console.log("ok1")
    return func1(1).then(() => {
      console.log("ok2")
      return func1(1).then(() => {
        console.log("ok3")
      }).catch(() => {
        console.log("ng3")
        // catchした場合、rejectを返さないと呼び出し元でcatchではなくthenに流れるので注意
        return Promise.reject()
      })
    })
  }).then(() => {
    // ok3までいったら、ここに来る
    console.log("ok all")
  }).catch(() => {
    // 途中で失敗したら、ここに来る
    console.log("ng")
  })
}

この例ではmain()のfunc1()呼び出しはすべて引数1なので、すべて成功して以下のようにコンソールに表示されます。

ok1
ok2
ok3
ok all

3回目のfunc1()の引数を1以外にして失敗させてみます。

-      return func1(1).then(() => {        
+      return func1(2).then(() => {        
          console.log("ok3")      

結果はこうなります。

ok1
ok2
ng3
ng