現役システムエンジニアの備忘録

技術スキルや用語などの記録を残していきます

基礎

【JavaScript入門】コメントの書き方|初心者向けに1行コメントと複数行コメントの使い方をわかりやすく解説

投稿日:2019年4月6日 更新日:

この記事で分かること

  • JavaScriptのコメントの基本(1行・複数行)
  • コメントアウトの正しい使い方
  • 実務でコメントを書くべき場面
  • 初心者がやりがちなコメントの失敗例
  • 読みやすいコードを書くためのコツ

JavaScriptのコメントは、コードの理解を助けるための重要な仕組みです。
特に初心者のうちは、処理の意図や注意点をコメントとして残すことで、後から見返したときの理解が大きく変わります。

この記事では、JavaScriptで使える1行コメント複数行コメントの書き方、そして実務での使い分けを初心者向けにわかりやすく解説します。



JavaScriptのコメントの書き方(基本)

JavaScriptでは、次の2種類のコメントが使えます。

  • //:その行の後ろがコメントになる(1行コメント)
  • /* ~ */:囲んだ部分がコメントになる(複数行コメント)

実際のコード例は次のとおりです。


// これは1行コメントです
console.log("Hello");

// 複数行コメントの例
/*
  ここに複数行コメントを書けます。
  処理の説明や注意点を書くときに便利です。
*/
console.log("World");

1行コメントは「短い説明」、複数行コメントは「まとまった説明」に向いています。



複数行コメントを書くには?

/* ~ */ を使うと、複数行にわたってコメントを書くことができます。


/*
  ここに複数行コメントを書けます。
  処理の説明や注意点をまとめて書くときに便利です。
*/

複数行コメントは、関数の説明や処理の概要を書くときに役立ちます。

コメントの用途(実務でよく使う場面)

コメントは実行時に無視され、スクリプトの動作には影響しません。主な用途は次のとおりです。

  • コードの意図や理由を説明する
  • 後から見返したときの理解を助ける
  • 一時的にコードを無効化(コメントアウト)して動作確認する
  • エラー箇所の切り分けに使う

特に「なぜこの処理が必要なのか」を書くコメントは、実務で非常に重宝されます。

初心者がやりがちなコメントの失敗例

  • コードをそのまま説明してしまう(意味がない)
  • コメントが古くなり、コードと矛盾する
  • 長すぎて逆に読みにくくなる

コメントは「コードの意図」を書くのがポイントです。

JavaScript 初心者におすすめの学習書籍

コメントの書き方を理解したら、次は JavaScript の文法・DOM・イベント処理を体系的に学ぶ段階です。
以下の書籍は、初心者がつまずきやすいポイントを丁寧に解説しており、理解が深まります。

いちばんやさしい JavaScript の教本

手を動かしながら JavaScript を学べる入門書です。
コメントの使い方やコードの読みやすさにも触れており、初心者に最適です。

この本で解決できること:

  • JavaScript の基本文法を体系的に理解できる
  • DOM・イベント処理の基礎が身につく
  • 読みやすいコードを書くための考え方が学べる

確かな力が身につく JavaScript「超」入門

JavaScript を基礎からしっかり学びたい人向けの入門書です。
コメントの使い方だけでなく、実務で必要な書き方も丁寧に解説されています。

この本で解決できること:

  • JavaScript の基礎を体系的に学び直せる
  • 初心者がつまずきやすい部分を重点的に理解できる
  • 実務で使えるレベルの基礎力が身につく

JavaScriptを動画で学びたい方へ(次のステップに最適)

コメントの使い方を理解したら、実際の画面でコードの動きを見ながら学ぶと理解が一気に深まります。

超JavaScript 完全ガイド 2026

JavaScript の基礎から応用までを体系的に学べる講座です。
コメントの使い方だけでなく、読みやすいコードを書くための実践的なポイントも学べます。

この講座で解決できること:

  • JavaScript の基礎〜応用を体系的に理解できる
  • コードの読みやすさ・保守性の考え方が身につく
  • DOM・イベント処理・非同期処理を動画で理解できる

超JavaScript 完全ガイド 2026(Udemy)

JavaScriptをとことんやってみよう

「まずは動かして理解したい」という方に向いている講座です。
コメントを使いながらコードを整理する練習にも最適です。

この講座で解決できること:

  • JavaScript の動きを実際に試しながら理解できる
  • DOM操作・イベント処理の基礎が身につく
  • 短時間で「動くものを作る」経験が得られる

JavaScriptをとことんやってみよう(Udemy)

体系的に学びたい方へ(スクールという選択肢)

コメントの使い方を理解したあと、JavaScript の文法・DOM・イベント処理・非同期処理を体系的に学ぶ段階に入ると、独学では急に難しく感じることがあります。

独学でつまずきやすいポイント

  • コードの意図が理解できず、読みづらい
  • イベント処理や非同期処理で混乱しやすい
  • コードレビューを受ける機会がない
  • 学習の順番に自信が持てない

こういった悩みが出てきたら、質問できる環境
学習ロードマップを一緒に作ってくれる人がいるだけで、理解スピードが大きく変わります。

無料相談で得られるメリット

  • あなたの現在のレベルに合わせた学習ロードマップを作成
  • つまずきやすい部分を事前に教えてくれる
  • 学習方法の改善点をプロがアドバイス
  • エンジニア転職を視野に入れたキャリア相談も可能

JavaScript を効率よく学びたい方には、未経験からエンジニアを目指せる
DMM WEBCAMP の学習コースも選択肢のひとつです。

DMM WEBCAMP 学習コース(無料相談はこちら)



JavaScriptのコメントに関するよくある質問(FAQ)

Q1

コメントは書きすぎても良くないの?

A

はい。コードをそのまま説明するコメントは不要で、逆に読みづらくなります。

Q2

コメントアウトは実務でよく使う?

A

一時的な動作確認では使いますが、不要になったコードは削除するのが基本です。

Q3

複数行コメントと1行コメントはどう使い分ける?

A

短い説明は1行コメント、処理の概要や注意点は複数行コメントが向いています。

Q4

コメントはSEOに影響する?

A

JavaScriptのコメントはブラウザ側の処理なので、SEOには影響しません。



まとめ|コメントを使いこなして読みやすいコードを書こう

JavaScriptのコメントは、コードの理解を助けるための重要な仕組みです。
1行コメントと複数行コメントを適切に使い分けることで、読みやすく保守しやすいコードを書くことができます。
初心者の方は、まずは簡単な説明からコメントを付ける習慣を身につけるのがおすすめです。



関連記事

【JavaScript入門】Content-Script-Typeとは?|初心者向けに歴史的仕様と現代の正しい書き方をわかりやすく解説

2019/04/05   -基礎

この記事で分かること Content-Script-Type とは何か(歴史的背景) デフォルトのスクリプト言語を指定する仕組み MIMEタイプ(text/javascript など)の意味 HTML …

【JavaScript入門】noscript要素の使い方|初心者向けに非対応ブラウザへの配慮方法をわかりやすく解説

2019/04/07   -基礎

この記事で分かること noscript 要素とは何か(役割と仕組み) JavaScript無効環境での表示切り替え方法 HTML4.01 と HTML5 の仕様の違い noscript 要素の注意点( …

【JavaScript入門】演算子まとめ|初心者向けに算術・比較・論理・代入・ビット演算子をわかりやすく解説

2019/04/13   -基礎

この記事で分かること JavaScriptの演算子の種類と役割 算術演算子の基本と使い方 比較演算子と条件式の仕組み 論理演算子(AND / OR / NOT)の動作 ビット演算子の基礎 代入演算子・ …

【JavaScript入門】new・delete・with・thisの使い方|初心者向けにオブジェクト操作の基本をわかりやすく解説

2019/04/17   -基礎

この記事で分かること new / delete / with / this の役割と違い オブジェクトを作成する方法(new) プロパティを削除する方法(delete) オブジェクト名を省略する書き方 …

【JavaScript入門】JavaScriptとは?初心者向けに特徴・できること・基本の仕組みを解説

2019/04/01   -基礎

この記事で分かること JavaScriptとは何か(初心者向けのやさしい説明) JavaScriptでできること(具体例付き) JavaScriptの特徴とメリット JavaScriptとJavaの違 …

このブログは Xserver 上の WordPress で運用しています。
表示速度が速く、安定しているのでブログ初心者にもおすすめです。

レンタルサーバー エックスサーバー

-基礎

執筆者: