こんにちは、すぐるです！
sugulogをお読みいただきありがとうございます！！
このブログは、「 過去の無知な自分に向けてわかりやすく説明するなら？？ 」を基準に書いています。
少しでもお役に立てれば幸いです。
今回は、Promiseオブジェクトを使用し非同期処理を扱おうということで
-
JavaScriptのPromiseオブジェクト
について簡単に解説します！！
その為このブログを読むことで、Promiseオブジェクトについて理解が深まるのはもちろん、非同期処理を扱う技術を手に入れることができます。
是非最後までご愛読ください。
今回は、
・Promiseオブジェクト
・メソッドチェーン
の順で解説していきます。
では早速、みていきましょう！！
・Promiseオブジェクト
非同期処理とは1つの処理を実行中であっても他の処理も同時並行で実行できる処理実行方式のことを言います。
JavaScriptではこの非同期処理という処理実行方式を取っています。
そのため処理時間がかかる関数などを実行した際に、その関数の処理が完了される前に次の処理が実行されたりする場合があります。
Promiseオブジェクトはそんな非同期処理を扱えるオブジェクトで処理の順番を制御することができます。
使用方法はnew Promise(関数)でインスタンスを生成します。
また引数の中の関数の引数には第一引数としてresolve(処理成功時の関数)を指定し、第二引数には任意でreject(処理失敗時の関数)を指定します。
上記ではresolve()が実行された場合はアロー関数の引数resolveには成功がvalueとして格納され、reject()が実行された場合はアロー関数の引数rejectにはvalueとして失敗が格納されます。
・メソッドチェーン
メソッドチェーンとはメソッドを実行した際にその結果に応じてさらにメソッドを実行する仕組みのことです。
Promiseオブジェクトにおいては処理成功時としてthen(関数)、処理失敗時としてcatch(関数)というメソッドチェーンが用意されています。
先程resolve()が実行された場合は引数resolveには成功がvalueとして格納され、reject()が実行された場合は引数rejectにはvalueとして失敗が格納されました。
メソッドチェーンを行うことでこの値を次の処理に継承することができます。
今回は成功時として処理を走らせています。
then(関数)のアロー関数の引数を指定することでresolveから値を継承することができます。
またここまでのPromiseオブジェクトを仕組みを利用すると非同期処理の制御を実感することができます。
上記のコードではPromiseオブジェクト自体は先に処理が始まりますがsetTimeoutで処理が実行される時間を遅らせています。
そしてPromiseオブジェクト後の処理としてthenやcatchを指定します。
そのため処理の順番が制御されthenやcatch内の処理は、Promiseオブジェクトの処理が終了した時点で実行されるようになります。
また最後に記載しているconsole.logの「記述としては後」の表記はPromiseオブジェクトに属していないため、コンソール上では先に表示され遅れてthenやcatchの内容が表示されます。(今回はfalseなので失敗を表示)
このように 1つの処理を実行中であっても他の処理を実行できる非同期処理の処理の順番を制御するのがPromiseオブジェクトです。
以上、今回のブログでした。
Promiseオブジェクトの基礎について理解が深まり、非同期処理を扱う技術を手に入れることができましたか？？
非同期処理について理解することで実装の幅が格段と広がります。
確実に自分の知識として蓄えていきましょう。
今回のToDo
Promiseオブジェクトを使用しthenやcatchの処理を実行してみましょう(≧∀≦)/
最後に！！
今後も、「 過去の無知な自分に向けてわかりやすく説明するなら？？ 」を基準にブログを書いていきます。
少しでも気になった方はお試しでもいいので1度読者登録お願いします！
最後までご愛読いただきありがとうございました！！