Promiseとasyncによる非同期処理

非同期処理

javascriptで非同期処理をかくために勉強した内容をメモ。

Promiseの公式ドキュ
developer.mozilla.org

asyncの公式ドキュ
developer.mozilla.org

JavaScript Promiseの本
azu.github.io

Promise

promiseオブジェクトを定義し、そこに関数resolveとrejectを登録する。

関数成功時はresolveが返され、失敗時はrejectが返される、ようにコードを書く。

成功時、失敗時の次の実行したいことを.then()で書く。

.then()はいくらでもつなげて書くことができる。

function promise() {
 return new Promise(function(resolve, reject) {
     setTimeout(function() {
         console.log('root', 5)
         resolve(5)
     }, 1000)
 })
}

promise().then(function(value) {
 console.log('promise', value)
 return value + 5
}).then(function(value){
 console.log('promise', value)
}).catch(function(error) {
 console.log('error')
 return new Error('error')
})

async

非同期処理を行う関数として、async functionとして定義する。

asyncで定義すると返り値は、promiseオブジェクトになる。

そのため.then()の書き方はいっしょ。

ただ、.then()をチェーン式に書かなくていいようなawaitという関数が用意されている。

awaithは、promiseの解決まで処理を一時停止するため、awaitを複数書けば.then()と実質いっしょのコードになる。

async function wait() {
 try {
     const x = await promise()
     console.log('async', x)

     const y = x + 5
     console.log('async', y)

     return y

 } catch(e) {
     return new Error('error')
 }
}

wait().then(function(value) {
})