前回の記事までで、JavaScriptの非同期処理がどのように変遷してきたのか整理。

Promiseの登場によって非同期処理の記述が容易になったことがわかりました。

それでもthenを用いた非同期処理はコールバック関数が必要なため、コードがネストしてしまい、以下のような同期処理と比べると可読性が下がります。

const post = getPost(postId);
const user = getUser(post.userId);
const org = getOrganization(user.orgId);

そこで、同期処理のような書き味と非同期処理を両立した書き方が望まれるようになり、asyncとawaitが導入されました。

await

awaitとは、非同期処理の完了を待つためのキーワード。
Promiseの値が参照できるようになるまで、awaitより下に書かれた処理に進まないようにする役割を持つ

async

asyncは非同期関数を宣言するためのキーワード。

このキーワードがついた関数は必ずPromiseを返すようになる。

async/awaitを使うことで非同期処理を行なっているにも関わらず、直感的で同期処理のように書くことが可能になる。

この書き方によって理解が容易で、可読性も高まるため、非同期処理が頻繁に行われる現代のJavaScriptプログラミングにおいて極めて有用な構文。

今回の記事もSoftware Design 2023年9月号の内容をまとめています。

▼参考文献