🙆‍♀️

オタクくん「ギャル先輩、リーダブルなコードってなんですか?」

2024/05/26に公開

オタクくん「最近、コードがぐちゃぐちゃで自分でも何を書いたか分からなくなるんですよね。ギャル先輩、リーダブルなコードってどうやって書くんですか?」

ギャル先輩「おっ、オタクくん。リーダブルなコードってことは、誰が見ても分かりやすいコードのことじゃん?コードが読みにくいと、メンテも大変だし、バグも見つけにくいし、いいことないよね。」

リーダブルなコードとは?

オタクくん「確かに。じゃあ、どうすればリーダブルなコードを書けるんですか?」

ギャル先輩「まず、命名規則をちゃんとすることが大事だよね。変数名や関数名はその役割が分かるようにするのが基本だよ。」

命名規則

オタクくん「例えば、どんな感じですか?」

ギャル先輩「例えば、ユーザー名を保持する変数なら、userName とか user_name とかね。よく x とか y とか意味不明な名前にしちゃう人いるけど、あれはダメだよwww」

オタクくん「なるほど、確かに x とか y じゃ分かりにくいですね。」

良い例

// ユーザー名を保持する変数
let userName = "Tanaka Taro";

悪い例

// 何を保持しているか分かりにくい
let x = "Tanaka Taro";

コメントの重要性

オタクくん「他には何かありますか?」

ギャル先輩「次にコメントだね。コメントはコードの意図や動作を説明するために使うよ。でも、コード自体が分かりやすければコメントは最小限にするのが理想じゃん?」

オタクくん「なるほど。でも、どんなときにコメントを追加すればいいんですか?」

ギャル先輩「例えば、特別な処理をしている部分や、ちょっと複雑なロジックがある部分にはコメントを追加するのがいいよ。」

良い例

// ユーザー名を表示する関数
function displayUserName(userName) {
  // ユーザー名が空でないことを確認
  if (userName) {
    console.log(`User Name: ${userName}`);
  } else {
    console.log("No user name provided.");
  }
}

悪い例

function displayUserName(x) {
  if (x) {
    console.log(x);
  } else {
    console.log("No user name.");
  }
}

関数の短さと単一責任の原則

オタクくん「他には?」

ギャル先輩「関数はできるだけ短く、単一の責任だけを持たせるのがいいよ。これを『単一責任の原則』って言うんだ。」

オタクくん「どうして短くするのが良いんですか?」

ギャル先輩「短くてシンプルな関数は理解しやすいし、テストもしやすいからね。それに、バグがあっても見つけやすいじゃん?」

良い例

// ユーザーを表示する関数
function displayUser(user) {
  displayUserName(user.name);
  displayUserAge(user.age);
}

// ユーザー名を表示する関数
function displayUserName(name) {
  console.log(`User Name: ${name}`);
}

// ユーザーの年齢を表示する関数
function displayUserAge(age) {
  console.log(`User Age: ${age}`);
}

悪い例

// 一つの関数に多くの責任がある
function displayUser(user) {
  console.log(`User Name: ${user.name}`);
  console.log(`User Age: ${user.age}`);
}

インデントとフォーマット

オタクくん「他に気をつけることはありますか?」

ギャル先輩「インデントとフォーマットも大事だよ。コードを読みやすくするために、インデントをちゃんと揃えるのが基本じゃん?あと、適切な改行を使って見やすくするのもポイント。」

オタクくん「確かに、ぐちゃぐちゃなコードは読みづらいですね。」

良い例

function exampleFunction() {
  if (true) {
    console.log("This is properly indented.");
  }
}

悪い例

function exampleFunction() {
if (true) {
console.log("This is not properly indented.");
}
}

コードの一貫性

オタクくん「他に何かありますか?」

ギャル先輩「コードの一貫性も大事だよね。同じプロジェクト内では、同じスタイルを貫くことが重要だよ。例えば、変数名のスタイルをキャメルケースに統一するとかね。」

オタクくん「なるほど。一貫性があると読みやすくなりますね。」

良い例

let userName = "Tanaka Taro";
let userAge = 25;

悪い例

let userName = "Tanaka Taro";
let user_age = 25;

オタクくんの問題解決

オタクくん「なるほど、いろいろ教えてくれてありがとうございます。これでリーダブルなコードが書けるようになりそうです!」

ギャル先輩「いえいえ、あーしもオタクくんの成長が見れて嬉しいよwww」

ギャル先輩「これからも頑張ってね、オタクくん!www」

オタクくん「はい、ありがとうございます!」

Discussion