変数名と関数名を直して読みやすくする練習 | 実践講座

今回やること

この記事では、曖昧な変数名と関数名を、意味が伝わる名前に直します。

命名を直すだけで、コメントを増やさずにコードが読みやすくなることがあります。

function handle(data: User) {
 const flag = data.age >= 18;

 if (flag) {
 return "ok";
 }

 return "ng";
}

短いコードですが、何を処理しているのか分かりにくいです。

中身を読まないと意味が分からない名前を、役割が分かる名前に変えます。

function getAgeCheckResult(user: User) {
 const isAdult = user.age >= 18;

 if (isAdult) {
 return "available";
 }

 return "unavailable";
}

isAdult のように boolean には is を付けると読みやすくなります。

戻り値が文字列である必要がないなら、booleanを返す関数にできます。

function canUseService(user: User) {
 return user.age >= 18;
}

呼び出し側は次のように読めます。

if (canUseService(user)) {
 showServicePage();
}

英語の文のように読める名前は、条件式と相性がよいです。

一時的な短い範囲ならよい場合もありますが、広い範囲では具体名を優先します。

命名改善は、最も手軽なリファクタリングです。曖昧な名前を、役割や条件が分かる名前へ変えるだけで、コードの理解コストが下がります。