【JavaScript】functionの前の括弧は何？即時実行関数について解説
なぜfunctionの前に括弧がついているのか？
JavaScriptを学び始めると関数について学ぶことになります。
例えば、下記の参考１のように記述すると、testという名前の関数を定義することができます。
【参考１】function test() {
alert("テストです");
}
これを実行することで、「テストです」というアラートが表示されます。
このように、JavaScriptでは簡単に関数を定義することができますが、勉強を進めていくと、functionの前に括弧がついた以下の参考２のようなコードを目にすることがあります。
【参考２】(function test(){
alert("テストです");
})();
これは即時実行関数と呼ばれるもので、その名の通り、定義した関数を即時に実行します。
今回はノンプログラマーの目線から、初心者の方に向けて、この即時実行関数について解説していきます。
即時実行関数の特徴 括弧がない関数と何が違うのか？
関数を実行するタイミング
即時実行関数を知る上で、必ず押さえておきたいことが、括弧がない関数との違いです。
上述の参考１のコードと、参考２のコードでは何が違うのでしょうか？
それは参考１のコードが、ただ関数を定義しただけであるのに対して、参考２の即時実行関数のコードは実行まで行うという点です。
参考１のコードは、例えば以下の参考３のようなコードを記述し、実行しなければ、「テストです」というアラートは表示されません。
【参考３】test();
しかし、参考２の即時実行関数のコードは、実行まで行うので、上記のようなコードは不要です。
つまり、参考２のコードが読み込まれたタイミングで実行されます。
スコープ（影響の範囲）
参考１のコードと参考２のコードではスコープ、つまりコードの影響範囲も異なります。
参考１のコードはグローバル関数と呼ばれ、このコードが読み込まれている状態であれば、
例えば、test01.jsというファイルに参考１のコードを記述し、test02.jsというファイルにそれを実行させる参考３のコードを書き、test03.htmlというファイルに２つのJavaScriptファイルを読み込ませます。
このようにしても、参考１のコードは問題なく実行されます。
しかし、参考２のコードをtest01.jsというファイルに記述し、再度それを実行するために別ファイルに参考３のようなコードを記述し、２つのファイルをtest03.htmlに読み込ませたとしても、参考２の処理を再度実行することはできません。
その原因は、コードのスコープが関係しています。
参考２に記述した関数は、functionの前の括弧開きからその括弧閉じの間までしか影響範囲がありません（以下の参考２´の赤色の括弧部分）。
【参考２´】(function test(){
alert("テストです");
})();
この範囲外ではfunction test()という関数を呼び出すことができません。
これが即時実行関数の特徴です。