📚
async/awaitブロックの使い方
JavaScriptの非同期コードを扱うためのasync/await
構文は非常に有用ですが、それを適用すべき場所とそうでない場所について明確な理解が必要です。
async/await
を使用する
ある処理を待つ必要がある場合のみある操作が完了するのを待つため、つまり非同期の操作結果を利用した何かをするためにはawait
を使用します。
しかし、適用する場所が適切でないと、無駄なパフォーマンスの損失を招いてしまうことがあります。
不適切な使い方の一例として、多く見られるのがreturn await
というパターンです。
const fetchUserPosts = async (
userId: bigint,
): Promise<UserPost[] | undefined> => {
return await database.posts.findMany({
select: { content: true },
where: {
userId,
},
});
};
このコードは動作しますが、async
関数から直接Promise
を返す際にはawait
は不要です。
そのため、次のように改善できます。
const fetchUserPosts = (
userId: bigint,
): Promise<UserPost[] | undefined> => {
return database.posts.findMany({
select: { content: true },
where: {
userId,
},
});
};
非同期の操作結果を使用しない場合はasync/awaitを使用しない
特にサーバーアクションやイベントリスナーのようなユースケースでは、非同期処理の結果を直接使用せず、次のアクションに進むことが一般的です。
これらの場合、await
を利用して処理をブロックする必要はありません。
これは、パフォーマンスを向上するだけでなく、コードの可読性も高めます。
Discussion