Slide 1
Slide 1 text
Promiseͷ෮शͱ༧श
あらや @arayaryoma
2019-06-06 Meguro.es # 21 @ ビザスク
たぶん初心者向け
Slide 2
Slide 2 text
自己紹介
あらや / 阿部 凌磨
@arayaryoma
@arayaryoma
https://araya.dev
Web developer at 株式会社ヘマタイト
JavaScript/TypeScript/Go/Kotlin
Angular/React/ReactNative/Next.js/Nest.js
Slide 3
Slide 3 text
Promise API
Promise.all
Promise.race
Promise.reject
Promise.resolve
Promise.any
Promise.allSettled
Promise.try
Promise.prototype.catch
Promise.prototype.then
Promise.prototype.finally
Slide 4
Slide 4 text
Promise.resolve(value)
引数で渡された値で解決されたPromiseオブジェクトを返す
Slide 5
Slide 5 text
Promise.reject(reason)
引数で渡された理由(reason)でリジェクトされたPromiseオブジェクトを返す
Slide 6
Slide 6 text
Promise.prototype.then(onResolved, onRejected)
第1引数に、Promiseが解決されたとき、第2引数にリジェクトされたときに呼ばれる
コールバック関数を受け取る。
Promiseを返す。
Slide 7
Slide 7 text
Promise.prototype.catch(onRejected)
Promiseがリジェクトされたときに呼ばれるコールバック関数を引数で受け取る。
Promiseを返す。
.then(undefined, onRejected)と等価。
Slide 8
Slide 8 text
Promise.prototype.catch(onRejected)
Promiseがリジェクトされたときに呼ばれるコールバック関数を引数で受け取る。
Promiseを返す。
.then(undefined, onRejected)と等価。
then͔ΒcatchνΣΠϯͰ͖Δ
Slide 9
Slide 9 text
Promise.all([…promises])
引数で渡されたイテレータブルなオブジェクトの中のすべてのPromiseが解決されたら
解決された単一のPromiseを返す。
Slide 10
Slide 10 text
Promise.all([…promises])
どれか1つでもリジェクトされたら、
そのreject reasonを持ってリジェクトされる。
Slide 11
Slide 11 text
Promise.race([…promises])
Promiseのイテレータブルなオブジェクトを受け取る。
受け取ったPromiseのうち、
どれか1つでも解決もしくはリジェクトされたら
その状態のPromiseを返す。
Slide 12
Slide 12 text
Promise.prototype.finally(callback)
解決されたかリジェクトされたかにかかわらず、Promiseが確立されたら、
引数で受け取ったコールバック関数が実行される。
Stage4
Slide 13
Slide 13 text
Promise.prototype.finally(callback)
確立されたらとりあえずなにか処理をして、それからthenとcatchを処理したい。
Stage4
finallyղܾ͘͠ϦδΣΫτ͞ΕͨΛ࣋ͬͨPromiseΛฦ͢
Slide 14
Slide 14 text
Promise.allSettled([…promises])
Stage3
allと同じく、Promiseのイテレータブルなオブジェクトを受け取る。
すべてのPromiseが解決もしくはリジェクトされるのを待ち、結果を持ったPromiseの配列を返す。
Slide 15
Slide 15 text
Promise.any([…promises])
Stage1
Promiseのイテレータブルなオブジェクトを受け取る。
受け取ったPromiseのうち、どれか1つでも解決されたら
その解決された値をPromiseとして返す。
すべてのPromiseがリジェクトされたら
リジェクト理由の配列を返す。
Slide 16
Slide 16 text
Promise.any([…promises])
Stage1
Promiseのイテレータブルなオブジェクトを受け取る。
受け取ったPromiseのうち、どれか1つでも解決されたら
その解決された値をPromiseとして返す。
すべてのPromiseがリジェクトされたら
リジェクト理由の配列を返す。
Slide 17
Slide 17 text
Promise.try(func)
Stage1
引数で受け取ったfuncが同期的に例外を吐いてもPromiseがリジェクトされたものとして扱える。
bluebirdから輸入(?) 最終更新は3年前・・・
Slide 18
Slide 18 text
Promise.try(func)
Stage1
Slide 19
Slide 19 text
Promise.try(func)
Stage1
Slide 20
Slide 20 text
·ͱΊ
PromiseのAPIはresolve, reject, then, catch以外にも、
知っていると便利なものがいくつかあります。
これを踏まえてPromiseで非同期処理を書いているコードを見直すと
きれいにまとめられる箇所が見つかるかもしれません。
tryに関しては使えるようになるかかなり怪しい・・・