JavaScriptのコメント

更新日:2017.03.02
  1. HOME
  2. JavaScript入門
  3. JavaScriptのコメント

ここでは、JavaScriptにおけるコメントの挿入方法を説明します。 コメントを入れておくと、長いJavaScriptのソースを書いた時に後で編集をするのが楽になります。 また他の人に自分が書いたスクリプトを見せる場合、説明を付しておくと理解してもらい易いでしょう。

コメントは、説明だけでなくミスを捜すデバッグにも使えます。その方法も見てみましょう。

JavaScirptのコメント

コメントは2通りの方法で記述できます。

//
1行だけのコメントになります。
/* ~ */
複数行に渡るコメントを記述するのに使用します。

個人的には1行用のコメントはよく使いますが、複数行のコメントは滅多に使いません。 しかしスクリプトがエラーで動かない時に、 複数行のコメントを用いてデバッグすることはあります。 その方法を次に解説致します。

コメントによるデバッグ

今はまだよく分からないと思いますが、下のようなスクリプトがあるとします。

var dom = document.getElementById("id");
var str = "ジャバスクリプト":
dom.innerHTML = str;

このスクリプトは、エラーが出て動きません。 2行目の最後がセミコロン「;」でなければいけないのに、 間違ってコロン「:」になっているからです。 もしこう言ったミスに気づかなければ、 コメントを使ってミスを捜していきます。

/*
var dom = document.getElementById("id");
var str = "ジャバスクリプト":
dom.innerHTML = str;
*/

問題がありそうな部分をコメントで囲み、 プログラム部分から除外してみます。 そうすると、他の部分は動作し始めます。 つまり、コメントで囲った部分のどこかに問題があると言うことが分かります。

問題箇所に見当が付いたら、あとは1行ずつ問題箇所を捜していきます。 コメントアウトする部分を1行ずつずらしていきます。

var dom = document.getElementById("id");
/*
var str = "ジャバスクリプト":
dom.innerHTML = str;
*/

↑まだプログラムは動きます。

var dom = document.getElementById("id");
var str = "ジャバスクリプト":
/*
dom.innerHTML = str;
*/

↑のようになった時、プログラムが動かなくなります。 つまり、そのすぐ上の行に問題があるということです。 こうして問題箇所を見つけ出すことができます。

ただし1行ずつ調べる方法は、次のページに出てくるalert()を私は使っています。 多分その方が分かり易いと思います。 では次に、alert()の使い方を見てみることにしましょう。