JavaScriptの文末にセミコロン「;」が必要な理由とそのルールをわかりやすく解説！

こんにちは。ゆうせいです。
今回は「JavaScriptで文末にセミコロン（;）を付ける必要があるのはどんな時か？」について、新人エンジニアの方にもわかるように、やさしく丁寧に解説していきます。

なぜセミコロンが必要なのか？

JavaScriptでは、文（ステートメント）の終わりを示すために セミコロン（;） を使います。
これは、日本語の「。」にあたるものだと思ってください。

しかし、実はJavaScriptには 自動セミコロン挿入（ASI：Automatic Semicolon Insertion） という仕組みがあります。
このおかげで、セミコロンを省略しても動くコードがたくさんあるんです。

でも……
「動く」と「安全」は別の話！
セミコロンを付けないことで、予期せぬバグにつながることもあるんです。

セミコロンが「絶対に必要」なケース

では、どんなときにセミコロンを付けなければいけないのでしょうか？

1. 複数の文を1行に書くとき

let a = 1; let b = 2;

→ セミコロンがないと、JavaScriptはどこで区切っていいか分かりません。

2. return、break、continue のあとに値を書くとき

function getValue() {
  return
  {
    value: 1
  }
}

これは バグの元！

実際に実行されるのはこういう意味になります：

return; // ここで終わってしまう
{
  value: 1 // 到達しない
}

→ return と値の間に 改行 があると、JavaScriptは自動でセミコロンを挿入してしまいます。

3. 即時関数（IIFE）を使うとき

let result = 10
(function() {
  console.log('実行される')
})()

これも注意！

上のコードでは 10(function()...) と解釈されてしまい、エラーになります。
解決策：

let result = 10;
(function() {
  console.log('実行される')
})()

→ セミコロンで区切られていれば安心！

セミコロンを付けないとどうなるか？

例：セミコロンなしの罠

let a = b + c
(d + e).print()

JavaScriptの解釈：

let a = b + c(d + e).print();

→ まったく違う意味になってしまうことも！

セミコロンを付けても問題ないなら、付けるのが安全！

初心者のうちは特に、「セミコロンは常につける」というスタイルをおすすめします。
たとえるなら、「横断歩道では青になるまで渡らない」くらい、安全を優先する習慣です。

ASI（自動セミコロン挿入）とは？

最後にちょっとだけ専門用語の解説を。

ASI（Automatic Semicolon Insertion） とは、JavaScriptの仕様で、「セミコロンがないとき、いい感じに補ってくれる機能」です。

ただし、「いい感じ」とは人間にとってではなく、JavaScriptエンジンの解釈基準にとっての“いい感じ”です。

そのため、「意図通りの動作」になるとは限りません。

まとめ表：セミコロンの必要性

今後の学習の指針

今後は以下のような観点からも理解を深めていきましょう。

• JavaScriptの パース（構文解析） の仕組み
• 他の言語との違い（たとえばPythonやGoなどではセミコロンは不要）
• ESLintなどの 静的解析ツール を使ったコード品質管理
• フォーマッター（Prettierなど）を導入して自動整形する方法

まずは、セミコロンをつける習慣をしっかり身につけて、安全で読みやすいコードを書けるようになっていきましょう！

セイ・コンサルティング・グループの新人エンジニア研修のメニューへのリンク

投稿者プロフィール

山崎講師代表取締役

セイ・コンサルティング・グループ株式会社代表取締役。
岐阜県出身。
2000年創業、2004年会社設立。
IT企業向け人材育成研修歴業界歴20年以上。
すべての無駄を省いた費用対効果の高い「筋肉質」な研修を提供します！
この記事に間違い等ありましたらぜひお知らせください。

最新の投稿

• 山崎講師2025年5月16日JavaScriptの文末にセミコロン「;」が必要な理由とそのルールをわかりやすく解説！
• 山崎講師2025年5月16日JavaScript配列のpush・popとshift・unshiftを使ったスタックとキューの仕組み解説
• 山崎講師2025年5月16日CSSショートハンドプロパティとは？初心者向けにやさしく解説！
• 山崎講師2025年5月16日CSSの使い分け完全ガイド：外部・内部・インラインスタイルの違いと使い分け