93
48

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

JavaScriptのコメントは4種類ある

Last updated at Posted at 2021-08-23

JavaScriptのコメントは///* */の2種類である、というのはよく知られた話です。

嘘です。

4種類あります。

//

1行コメントです。

let a = 1; // ここから行末までコメント

誰もが使ったことやるやつですね。
//から行末までがコメントになります。

おそらく、最もよく使われているコメントだと思います。

/* */

複数行コメントです。

/*
	コメント
	終了まで全てコメント
*/

こちらもよく使いますね。

/*
	/*
		コメントのネストはできない
	*/ ここがコメントの終わりなのでシンタックスエラーになる
*/

<!-- -->

実は<!-- -->という形のコメントも許可されています。

これはES2015で追加されたHTML-like Commentsというものです。
見てわかるとおりHTMLのコメント形式です。

let a = <!-- ここはコメント
1
--> ここもコメント

a=1になります。

開始タグは行の途中にも書けますが、終了タグは先頭(スペースは可)にしか置けません。
開始タグの後ろにある文字列と、あと終了タグの後ろの文字列も何故かコメント扱いになります。
その間にある行はコメントではなく、有効なJavaScriptとして解釈されます。

どうしてこんな仕様が存在するのかというと、歴史的理由というやつです。

いにしえのJavaScriptは、JavaScript非対応ブラウザでコードが画面に表示されてしまわないように、このように書かれていました。

<script language="javascript">
<!--
  var a = 1;
-->
</script>

これが動くようにするために必要な仕様として、この形式のコメントは昔から実装されていました。
つまり、ES2015で初めて追加されたコメント形式というわけではなく、昔からの実装に仕様を合わせたということですね。
従って、この形式のコメントは規定されてこそいるものの、使用しないことが推奨されています。

実は<!---->はセットで使う必要はなく、それぞれ単独でも使うことができます。

これも有効なJavaScript
a=1;

--> ここはコメント

--> ここもコメント

どんな意味があるのかはわかりません。

#!

Nodeのスクリプトは、先頭に#! /usr/bin/env nodeみたいなのが入っていることがあります。
これはNodeでは有効な形式なのですが、普通のJavaScriptでは動きません。
なので同じスクリプトを使い回したいときとかに困るわけです。

そんなわけで、ファイルの先頭にある#!のみコメント行として扱う、というプロポーザルが提出されています。
プロポーザル自体はStage3で止まっているのですが、実装は進んでいて既に有名ブラウザでは全て使用可能です。
これによってファイルの使い回しが楽になります。

コメント扱いされるのは先頭行の先頭のみで、それ以外の行や、コードの途中などに#!と書いてもコメント扱いされることはありません。

Linuxなどではshebangと呼ばれていますが、JSでは#sheじゃなくてhashって呼ぶからshebangじゃなくてhashbangだよ、だそうです。

まとめ

5種類目があったらどうしよう。

93
48
3

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
93
48

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?