【JS学習マラソン】第5回 1.2.2 コード構造
JavaScript学習マラソンの第5回は、
「現代の JavaScript チュートリアル」パート1の2.2「コード構造」です。
コード構造 https://ja.javascript.info/structure
を読んでみます。
文末の区切りはセミコロン「;」
JavaScriptの命令文は、区切りとして文末にセミコロン「;」を付けます。
セミコロンの省略
文末のセミコロンを省略しても、JavaScriptには「自動セミコロン挿入」という機能があって、省略された文末のセミコロンが自動的に補われて、プログラムは動作します。
https://tc39.github.io/ecma262/#sec-automatic-semicolon-insertion
自動セミコロン挿入の欠点
しかし、「自動セミコロン挿入」にも欠点があり、プログラマーが思っているのとは違う形でセミコロンが挿入されてしまう場合があります。
自動でセミコロンが挿入されることによって、省略によるエラーの発生は減らせますが、意図した動作にならない場合が出てきます。
=結局はバグになる。
文末のセミコロンは省略しないのが基本
文末のセミコロンを省略しなければならない特別な事情がない限りは、プログラマーが文末のセミコロンを書く方が良いです。
チュートリアルでは、文末のセミコロンを省略した場合の問題点を例をあげて説明してます。
改行によって文が分割されていたとしてもセミコロンを置くことを推奨します。
このルールはコミュニティで広く採用されています。
再度留意しましょう – ほとんどの場合でセミコロンは除くことが 可能 です。
しかし、特に初心者はセミコロンを使うのが安全です。
(参考)JavaScriptの行末セミコロンは省略すべきか | blog.tai2.net
JSの設計者であるBrendan Eichは、 自身のブログ で、ASIはあくまでセミコロンを誤って書き忘れた場合の訂正措置であり、普遍的に改行に意味を持たせるような使い方をすれば、トラブルに巻き込まれるだろうと言っています。
The infernal semicolon – Brendan Eich
be careful not to use ASI as if it gave JS significant newlines.
JavaScriptの作者自身が
「文末にセミコロンを付けた方が良い。」
「自動セミコロン挿入は、あくまでもセミコロンを付け忘れたときの救済措置で用意されている機能であり、積極的に使うべきものではない。」
と言ってるのだから、素直にセミコロンを書いておけば良いでしょう。
セミコロンの省略をカッコイイ書き方だと勘違いするのは中学2年生まで?
コメントの書き方
JavaScriptのプログラム中にコメント(注釈)を書く場合、2通りの書き方が用意されています。
- 単一行のコメント: 「//」をコメントの前に書く。
- 複数行のコメント: 「/*」と「*/」の間に書く。
コメントアウトとアンコメント
プログラミング言語で、コメントの使い方は注釈を書くだけでなく、プログラムの行を一時的に無効にするためにも使われます。
用語
- コメントアウト(comment out):コメントの記号を付けて、コードを無効にする。
- アンコメント(uncomment):コメントの記号を取って、コードを有効にする。
// alert( '無効です' ); ← コメントの記号「//」を付けて、このコードを無効にしている。
alert( '有効です' ); ← コメントの記号「//」を取って、このコードを有効にしている。
JavaScriptのコメントはネスト(入れ子)にできない
JavaScriptでは、「/* ~ */」の間にさらに「/* ~ */」を入れて、入れ子にした複数行のコメントを書くことはできません。
最初に出てくる「*/」で複数行のコメントは終わりと判断されて、2個目の「*/」が余ってしまいます。
たいていのプログラミング言語では、コメントのネストはできないので、これが普通でしょう。
しかし、ScalaやHaskellなど、複数行のコメントを入れ子にできるプログラミング言語もあります。
JavaScriptでは、複数行をコメントアウトするとき、うっかり入れ子にしないように注意が必要ですね。
まとめ
- 文末にはセミコロン「;」を付けます。
- コメントは「//」、「/*」~「*/」で書けます。

スラスラ読める JavaScript ふりがなプログラミング (ふりがなプログラミングシリーズ)
- 作者: リブロワークス,及川卓也
- 出版社/メーカー: インプレス
- 発売日: 2018/06/22
- メディア: 単行本(ソフトカバー)
- この商品を含むブログを見る