JavaScript 即時実行関数

即時実行関数（Immediately Invoked Function Expression／IIFEs）の概念と使用理由

「即時実行関数（Immediately Invoked Function Expression／IIFEs）」とは、関数を定義すると同時に即座に実行される関数式を意味します。この手法は、変数のホイスティングやスコープの汚染を防ぐために使用され、関数ブロック内でコードを記述する際に有用です。関数は定義された直後に即実行され、主にブラウザーのコンパイラによって関数が読み込まれた直後に呼び出されます。

JavaScriptでは、変数のスコープ（有効範囲）が非常にややこしい問題になることがよくあります。グローバル変数が多くなると、開発者同士や複数のJavaScriptファイル間で衝突が発生したり、変数が意図せず上書きされるなどのスコープの汚染が起こる可能性があります。さらに、varキーワードで宣言された変数や関数宣言は、スコープの先頭に巻き上げられる「ホイスティング（hoisting）」という動作が発生します。そのため、JavaScriptの開発者たちは、面倒な変数スコープの問題を解決するために、関数の特性を活用したコーディング手法を取るようになりました。（もちろん、モダンなJavaScriptであれば、moduleを利用することでこうした煩わしい問題も容易に解決できます。）

以下は即時実行関数の例です。

(function() {  // 即時実行関数
    let a = 1;
    let b = 2;
    let c = a + b;
    console.log(c);
})();

let a = 2;  // 即時実行関数内の変数aと衝突しません

即時実行関数とは、変数のホイスティングを防ぎ、スコープの汚染を防ぐために関数の特性を活用し、関数ブロック内でコーディングする手法であり、定義されると同時に即座に実行される（ブラウザのコンパイラが関数を読み込んだ後に直接呼び出される）関数式を指します。

1. 関数を定義し

function fn() { /* code */ }

2. ( )や引数がある場合は、(引数)を使って定義した関数を即時に呼び出します

(function fn() { /* code */ }());

# グループ演算子()を使う方法

(function fn() {
    /* code */ 
}());

(function fn() {
    /* code */ 
})();

# 単項演算子の特性を利用する方法

!function fn() {
    /* code */ 
}();

+function fn() {
    /* code */ 
}();

-function fn() {
    /* code */ 
}();

即時実行関数の使い方

# 主に匿名関数として使用されます

(function () {
    /* code */ 
}());

# 引数を利用する方法

(function(initialValue) {
    let count = initialValue;
    console.log(count);
}(10));

// 出力: 10

参考資料

codingEverybody : JavaScript 即時実行関数