Promiseを用いる非同期処理

#同期処理と非同期処理

• 同期処理：プログラムを上から下へと順番に処理を行う（途中で時間のかかる処理があるとそれ以降の処理が全てストップしてしまう）．
• 非同期処理：結果を待たずして次に進む処理

unction asyncFunc(param) {
  // 非同期処理
  setTimeout(() => {
    console.log(param)
  },100)
}

// 順番が前後する例
function test() {
  console.log('1')
  // 非同期処理
  asyncFunc('2')
  console.log('3')
}
test()

出力

1
3
2

##Promiseを用いて非同期処理を実装
非同期処理の実装には，処理（関数）を返却する際にPromiseオブジェクトを用いる．

function asyncFunc(param) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      if (param === 'b') {
        //エラー時
        return reject({data: err})
      }
      //正常終了時
      return resolve(param)
    }, 100)
  })
}

ここでPromiseオブジェクトについてまとめる．
Promiseオブジェクトは引数に非同期処理である関数のみをとる．また，非同期処理に渡ってくる引数はresolveとrejectのふたつの関数．
resolve
非同期処理が成功した際に，resolve関数にその成果となる値を渡す．
reject
非同期処理が失敗した際に，reject関数に問題となるエラーオブジェクトを渡す．

##非同期処理とasync/await
非同期処理を実装するPromiseとasync/awaitはセットと考えて良い．
非同期処理において，ある処理を待ってから次の処理に進みたいときに用いるのがawaitであり，またその際に関数の頭につけなければいけないのがasyncなのである．

##thenとcatchとfinally
非同期処理では，それ以降の処理を記述する際にthen/catch/finallyが用いられることがある．
then
非同期処理が成功した際にその結果を受けて続けて行う処理．
catch
非同期処理がエラーの際に，catchを行うことでエラーオブジェクトを取得可能．
finally
非同期処理が成功しても失敗しても必ず行われる処理．

async function testAwait() {
  const ret1 = await 
  asyncFunc('a')
  console.log(ret1)
 
  const ret2 = await 
  asyncFunc('b').catch(err => err.data)
  console.log(ret2)

  const ret3 = await 
  asyncFunc('c').then(data => data + 'c')
  console.log(ret3)
}

出力

a
err
cc

また，これ以外に複数のPromise処理を連結して行うためのメソッドallがある．

async function testAwait2{
  const rets = await Promise.all([
    asyncFuncPromise('d'),
    asyncFuncPromise('e'),
    asyncFuncPromise('f')
  ])
  console.log(rets)
}

出力

['d','e''f']