プロを目指す人のためのTypeScript入門 読書メモ⑬ 第8章(2)
■ 思ったこと
次の案件はAngularなのだ、リンバスで気になったキャラはドンキとエビ蕎麦、頼れるエースは黒雲りょーしゅう、グtttッチ
■ 第8章 非同期処理(8.3.1~8.3.11)
- 前回はコールバック関数を使って処理の後に使いたい関数を都度呼んでいたが…?
Promise
- Promise使うと非同期処理が終わった後の処理を表す関数をセットできる!わぁ!便利そう!
- 実行結果は
Promiseオブジェクト
を返す - 帰ってきたオブジェクトで
thenメソッド
作って、実行したいコールバック関数を渡す流れ - 仕組み的には、非同期処理が終わってPromiseの結果が決まると(=解決すると)thenに登録されたコールバック関数が呼ばれる感じ
- 実行結果は
一つのPromiseに複数thenが登録されていたら?
- すべてが登録順に呼ばれるよ
Promiseの成功・失敗
- Promiseの解決には成功もあれば失敗もある
- その場合、帰ってきたオブジェクトに
catchメソッド
も作ってあげればOK - こんな風にすれば一気に書けるぜ、errorの戻り値がanyなのは注意
result.then(() =>{ console.log("やった、成功!"); },(error) =>{ console.log("残念、失敗!"); });
- 例によって
finallyメソッド
も使えます、成功しても失敗しても呼ばれるやつだね
Promiseオブジェクトを作ってみよう
new Promise<型引数>(executor関数)
で作れる、結果は変数に入れたり returnにしたり- executor関数っていうのは要するに引数だが、new Promiseの一環として即座に実行されるよ
- executor関数の引数にも関数を渡さなければいけない、でも
resolve
って書いとけばおけ- resolveはnewするとPromiseが用意してくれるコールバック関数だ!
- これが呼ばれるとPromiseが成功する、つまりthenに設定した関数が呼ばれてくれる
- executor関数ももちろん失敗あるかもなので、第二引数
にreject
セットしとけばおけ
Promiseの静的メソッドいろいろ
- 静的メソッドは、インスタンス化しなくてもクラス名.メソッド名で使えるやつだったね
- Promiseにもそーいうのがあるってことさ
- 例えば
Promise.resolve
とPromise.reject
、即座に成功or失敗オブジェクトを作成できる Promise.all
は複数のPromiseを合成してくれる、どゆこと!?- Promiseのオブジェクト配列を引数として受け取って全部成功したら成功のオブジェクト返してくれる
- 一個のthenでまとめて結果がゲッチューできるってことさ
- 他にも
Promise.allSettland
がある- allと動きはほぼ同じだけど、失敗時に即失敗せず最後まで実行してくれる
- 結果が成功と失敗それぞれのステータスでオブジェクトで返ってくる感じだよん
Promiseはチェーンで実行せよ
- ただ結果をどーにかするだけなら直接呼び出せるチェーン推奨!catchを忘れず繋げとこう
readFile("./file/foo.txt","utf8") .catch(() => "error!!") //エラーならキャッチ .then((result) =>{ // 問題なければ処理 console.log(result); });
dynamic import構文
import("モジュール名")
という構文、モジュールを非同期で呼び出せマス- 実行されるまでモジュールが読み込まれない、必要になるまで読み込ませたくない人には便利
- 結果はPromiseで返ってくるのでthenで取得して使っちゃおう
■ 感想
分割代入の配列バージョンに触れてなかったことに気づいた。const[foo, bar,baz] = arr
ってやればarrの中身が名前なくても順番に当てはまってくれるってやつ!あと、久しぶり過ぎてアロー関数で式返したいときのreturnも忘れてた、やば!!