JavaScript Promise API in 2019

Transcript

1. Promiseͷ෮शͱ༧श あらや @arayaryoma 2019-06-06 Meguro.es # 21 @ ビザスク たぶん初心者向け

2. 自己紹介 あらや / 阿部 凌磨 @arayaryoma @arayaryoma https://araya.dev Web developer

   at 株式会社ヘマタイト JavaScript/TypeScript/Go/Kotlin Angular/React/ReactNative/Next.js/Nest.js

3. 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

4. Promise.resolve(value) 引数で渡された値で解決されたPromiseオブジェクトを返す

5. Promise.reject(reason) 引数で渡された理由(reason)でリジェクトされたPromiseオブジェクトを返す

6. Promise.prototype.then(onResolved, onRejected) 第1引数に、Promiseが解決されたとき、第2引数にリジェクトされたときに呼ばれる コールバック関数を受け取る。 Promiseを返す。

7. Promise.prototype.catch(onRejected) Promiseがリジェクトされたときに呼ばれるコールバック関数を引数で受け取る。 Promiseを返す。 .then(undefined, onRejected)と等価。

8. Promise.prototype.catch(onRejected) Promiseがリジェクトされたときに呼ばれるコールバック関数を引数で受け取る。 Promiseを返す。 .then(undefined, onRejected)と等価。 then͔Βcatch΁νΣΠϯͰ͖Δ

9. Promise.all([…promises]) 引数で渡されたイテレータブルなオブジェクトの中のすべてのPromiseが解決されたら 解決された単一のPromiseを返す。

10. Promise.all([…promises]) どれか1つでもリジェクトされたら、 そのreject reasonを持ってリジェクトされる。

11. Promise.race([…promises]) Promiseのイテレータブルなオブジェクトを受け取る。 受け取ったPromiseのうち、 どれか1つでも解決もしくはリジェクトされたら その状態のPromiseを返す。

12. Promise.prototype.finally(callback) 解決されたかリジェクトされたかにかかわらず、Promiseが確立されたら、 引数で受け取ったコールバック関数が実行される。 Stage4

13. Promise.prototype.finally(callback) 確立されたらとりあえずなにか処理をして、それからthenとcatchを処理したい。 Stage4 finally͸ղܾ΋͘͠͸ϦδΣΫτ͞Εͨ஋Λ࣋ͬͨPromiseΛฦ͢

14. Promise.allSettled([…promises]) Stage3 allと同じく、Promiseのイテレータブルなオブジェクトを受け取る。 すべてのPromiseが解決もしくはリジェクトされるのを待ち、結果を持ったPromiseの配列を返す。

15. Promise.any([…promises]) Stage1 Promiseのイテレータブルなオブジェクトを受け取る。 受け取ったPromiseのうち、どれか1つでも解決されたら その解決された値をPromiseとして返す。 すべてのPromiseがリジェクトされたら リジェクト理由の配列を返す。

16. Promise.any([…promises]) Stage1 Promiseのイテレータブルなオブジェクトを受け取る。 受け取ったPromiseのうち、どれか1つでも解決されたら その解決された値をPromiseとして返す。 すべてのPromiseがリジェクトされたら リジェクト理由の配列を返す。

17. Promise.try(func) Stage1 引数で受け取ったfuncが同期的に例外を吐いてもPromiseがリジェクトされたものとして扱える。 bluebirdから輸入(?) 最終更新は3年前・・・

18. Promise.try(func) Stage1

19. Promise.try(func) Stage1

20. ·ͱΊ PromiseのAPIはresolve, reject, then, catch以外にも、 知っていると便利なものがいくつかあります。 これを踏まえてPromiseで非同期処理を書いているコードを見直すと きれいにまとめられる箇所が見つかるかもしれません。 tryに関しては使えるようになるかかなり怪しい・・・