IIFEにおけるセミコロンの安全性

今度は、即時実行関数式の前にプラス記号ではなく、丸括弧で囲む方法を見てみましょう。次のようになります：

(function() {
	console.log(1); // 1を出力
})();

変数 num が関数の外部で定義されているとします：

let num = 1; // セミコロンあり

(function() {
	console.log(num); // 1を出力
})();

ここで、セミコロンを付け忘れた場合を考えましょう：

let num = 1

(function() {
	console.log(num); //!! エラーが発生
})();

このコードはエラーを引き起こします。 JavaScriptがこの関数を最初の行のコマンドの続きとして解釈してしまうためです。

このような問題を避けるためには、即時関数の前に常にセミコロンを置く必要があります。次のように：

let num = 1

;(function() {
	console.log(num); // 1を出力
})();

この問題は少し大げさに思えるかもしれませんが、実際はそうではありません。例えば、ページに複数の別々のファイルからスクリプトを読み込む状況が考えられます。この場合、あるファイルの末尾にセミコロンが抜けていて、次のファイルが即時関数で始まると、自動的に問題が発生します。

したがって、今は問題がないと確信している場合でも、即時関数の呼び出しの前には常にセミコロンを置くべきです。問題は後になって発生する可能性があります。

上記を適用して、先頭にセミコロンを置いた即時関数を呼び出しましょう：

;(function() {
	console.log(1); // 1を出力
})();

コードを実行せずに、コンソールに何が出力されるか判断してください：

let str = 'str';

(function() {
	console.log(1);
})();

コードを実行せずに、コンソールに何が出力されるか判断してください：

let str = 'str'

(function() {
	console.log(1);
})();