【JavaScript】非同期処理・promise・await/asyncあたりのまとめ【備忘録】

JavaScript

前書き

しばらくぶりにブログを更新します。研究がセキュリティの方向を向いていないので最近全くセキュリティが出来ていません...（セキュリティをしようとすると心の中のもう一人が「研究の進捗はどうですか？」とささやく...）。山梨のミニキャンあたりには行きたい...。あと、最近バイクを手に入れたのもあってさらに何もしていない...。まぁでも米粒程度には進捗が出ていると思うのでヨシとするか...。研究でJavaScriptを使うことになりそうなのですが、JavaScriptなんて使ったことがなかったので、調べたことを備忘録的に書いていきます。（Beginnersの解き直しもまだ終わってないが...）
分かりやすくまとめられているnoteの記事があったのでリンクを張らさせていただきます。

note.com

非同期処理

基本的にプログラムは上から下へ、命令を順番に実行していき、自分の前の命令の実行が完了してから自分が実行されるが、非同期処理では、自分の前にいる命令の実行が完了されていなくても自分が実行される。

Promise

非同期処理の実現のために利用されるコールバックでは、コールバックのネストが深くなりすぎて可読性が低下する（コールバック地獄）ためこれを解消するためにPromiseという仕様が登場した。
Promiseの利用方法としては、Promiseオブジェクトを作成し、返す。（return new Promise(function);）
functionには処理したい内容を記述するが、処理に成功した場合にはfunction内のresolve();が実行され、そうでない場合にはreject();が実行される。

function a(){
    return new Promise( b(resolve,reject){
        if(c){
            resolve(d);
        }
        else{
            reject(err);
        }
    });
}

Promiseオブジェクトは処理に成功した場合にはその時の処理をコールバック関数として.then()メソッドに渡し、そうでない場合には、エラー処理を.catch()メソッドに渡す。
この.then()メソッドや.catch()メソッドを利用して非同期処理のより分かりやすい記述を実現する。

await/async

Promiseの導入でずいぶんと読みやすくなったものの、非同期処理が増えてくるとやはり読みにくくなる（らしい）。await/asyncの導入によって、非同期処理の記述が（コード上では）同期処理しているように扱うことが出来る。asyncではreturn new Promise(function);の最初と最後の部分をやっている（と認識している）。awaitは.then()メソッドと同じ役割を持っている（と認識している）。