Prompt
JavaScriptでセミコロンをまったく使わなかったときに起きる弊害はある?
どちらにせよ、セミコロンは無いとアレルギーが出るから何と言われようとセミコロンはつけるけど
あはは!その 「セミコロンが無いとアレルギーが出る」 という感覚、エンジニアとして非常に健全で素晴らしいね。僕もどちらかと言えば、文末にはピリオドやセミコロンがないと落ち着かないタイプだよ。
結論から言うと、JavaScriptには 「ASI (Automatic Semicolon Insertion / 自動セミコロン挿入)」 という、ブラウザが気を利かせて勝手にセミコロンを補完してくれるお節介な機能があるんだ。
でも、この「お節介」が原因で、「人間が意図したコード」と「ブラウザが解釈したコード」に致命的なズレ が生じることがある。君がアレルギーを回避してセミコロンを打ち続けることで、防げる代表的な「地獄」を紹介するよ!
1. 悪夢の return 文の泣き別れ
これが最も有名で、かつ最も発見しにくいバグだね。
JavaScript
// 人間が書いたつもり(オブジェクトを返したい)
function getUser() {
return
{
name: "asappy"
}
}
// ブラウザが解釈したもの(ASIの暴走)
function getUser() {
return; // ← ここで勝手に終わらされる!
{
name: "asappy"
};
}
この関数を実行すると、エラーにもならず静かに undefined が返ってくるんだ。オブジェクトがあるはずなのに中身がない。まさに還元主義的に言えば「存在の消失」だね。
2. 行頭の [ や ( で起きる「合体事故」
JavaScriptでは、前の行の末尾にセミコロンがない場合、次の行の行頭が [ や ( で始まっていると、「前の行の続き」 だと解釈されるルールがあるんだ。
JavaScript
// 人間が書いたつもり
const a = b
[1, 2, 3].forEach(n => console.log(n))
// ブラウザが解釈したもの
const a = b[1, 2, 3].forEach(n => console.log(n));
ブラウザは「変数 b の 3 番目の要素(コンマ演算子の評価結果)に対して forEach を実行しようとしている」と勘違いし、多くの場合 TypeError で爆死するよ。
3. 無名関数の即時実行 (IIFE) の悲劇
君のように複数のファイルをまとめたり、ツールを使ってコードを圧縮(Minify)したりする際に、セミコロンがないと悲惨なことになる。
JavaScript
// file1.js
const hello = () => console.log("Hi")
// file2.js
(function() {
console.log("Secret")
})()
これらが連結されると、hello()(...) という「関数を実行して返ってきた値に引数を与えてまた実行する」という謎のコードになり、これまた TypeError を吐いて止まるんだ。
4. なぜ「セミコロン不要論」があるのか?
最近の Prettier などのフォーマッターや、一部のモダンなスタイルガイド(StandardJS など)では「セミコロンなし」を推奨していることもある。
-
理由: 「どうせ ASI があるんだから、コードを短くスッキリさせよう」というミニマリズム的な思想だね。
-
ただし: 彼らは 「行頭に
(や[が来る場合は、必ず行頭にセミコロン;を置く」 という、本末転倒なルール(;(みたいな書き方)を強いることがよくあるんだ。
豆知識:Rust 経験者には耐えられない?
君は Rust を学んでいるけれど、Rust においてセミコロンは 「文 (Statement)」と「式 (Expression)」を分ける極めて重要な意味 を持っているよね。
-
セミコロンを つければ、その行は何も返さない(Unit型
()を返す)。 -
セミコロンを 抜けば、その行は値を返す。
この「厳格な意味の差」を知っている君にとって、JavaScript の「あってもなくてもいい(けどたまに死ぬ)」という適当さは、まさにアレルギーの源泉かもしれないね!
結論:セミコロンは「命の恩人」
君がセミコロンをつけ続ける限り、上記のような「ASIの気まぐれ」に怯える必要は一切ない。
「コードは人間が読み、機械が実行するもの」 である以上、曖昧さを排除して明示的に終端を示す君のスタイルは、情報工学的に見ても非常に正しく、堅実だよ。そのままのアレルギーを大事にして突き進んでほしい!
次は、セミコロンに関連して、「JavaScript の ASI を逆手に取った、もっと変態的な難解難解プログラミング (JSFuck)」 の世界を覗いてみる?それとも、Rust のセミコロンの挙動についてもっと深く語り合う?
Would you like me to demonstrate more edge cases where ASI leads to logic errors in JavaScript?