JavaScript 逆引き集 | コメントアウトのスタイル

JavaScript JavaScript
スポンサーリンク

コメントアウトのスタイル — // / /* ... */

JavaScript では コメントアウトを使って「コードの説明」や「一時的な無効化」を行います。
初心者は「// は1行コメント、/* ... */ は複数行コメント」と覚えると理解しやすいです。


基本のコード例

1行コメント

// これは1行コメントです
const x = 10; // 行の途中にも書ける
JavaScript
  • // → その行の終わりまでがコメント扱い。

複数行コメント

/*
これは複数行コメントです
コードの説明を長く書きたいときに便利
*/
const y = 20;
JavaScript
  • /* ... */*/ までがコメント扱い。複数行にまたがって書ける。

よく使うテンプレート集

コードの説明を入れる

// ユーザーの年齢を計算する関数
function calcAge(birthYear) {
  return new Date().getFullYear() - birthYear;
}
JavaScript

一時的にコードを無効化する

/*
console.log("デバッグ用ログ");
console.log("ここは一時的に無効化");
*/
JavaScript

行末に補足を書く

const taxRate = 0.1; // 消費税率10%
JavaScript

例題: コメントでコードを読みやすくする

// 商品の合計金額を計算する
function calcTotal(price, quantity) {
  const subtotal = price * quantity; // 小計
  const tax = subtotal * 0.1;        // 消費税
  return subtotal + tax;             // 合計
}

console.log(calcTotal(1000, 2)); // → 2200
JavaScript
  • 効果: コメントを入れることで「何をしているか」がすぐ分かる。

実務でのコツ

  • 短い説明 → //
  • 長い説明や複数行 → /* ... */
  • コメントは「なぜそう書いたか」を説明するのがベスト(コード自体が「何をしているか」は見れば分かる)。
  • 本番コードでは不要なコメントアウトを残さない → 読みにくくなる。

ありがちなハマりポイントと対策

  • ネストできない:
/* コメント開始
   /* ここにさらにコメント */ ← エラー
コメント終了 */
JavaScript

/* ... */ の中にさらに /* ... */ は書けない。

  • コメントしすぎは逆効果: コードが見づらくなるので、必要な部分だけに絞る。

練習問題(コメントを使って説明を追加)

// 三角形の面積を計算する関数
function triangleArea(base, height) {
  return (base * height) / 2; // 底辺×高さ÷2
}

console.log(triangleArea(10, 5)); // → 25
JavaScript

直感的な指針

  • // = 1行コメント。
  • /* ... */ = 複数行コメント。
  • 説明や補足に使う。
  • 「なぜそう書いたか」をコメントすると読みやすい。

これを覚えれば「コードの意図を分かりやすく説明」できるようになり、初心者でも安心して読み返せるコードになります。

タイトルとURLをコピーしました