[JavaScript General] immediate function pattern（即時関数）

用語の整理。

[markdown]
## 即時関数の書式

即時関数の書式は、`(関数宣言)();`。

– 関数定義を読み込んだタイミングで即実行する。
– 関数をスコープの枠組みとして使う。

“`javascript
// 普通に関数宣言と実行を書くと
function f(args) {
:
}
f(args);
// 関数宣言を囲って匿名関数にし呼び出し
(function (args) {
:
})(args);
“`

> * [知ってて当然？初級者のためのJavaScriptで使う即時関数(function(){…})()の全て – 三等兵](http://d.hatena.ne.jp/sandai/20110824/p1)

– 即時関数とは、「関数定義」「関数呼び出し」の2つをまとめて行なうことができるもの。
– 即時関数がグローバル変数の使用を抑えることができる。
– 即時関数を使えば内部で宣言した変数や関数はローカルに限定される。
`(関数宣言)();` について
– 関数を式として評価させることで( )をケツにひっつけて呼び出せるようにする。
– functionが行の先頭にあるなら関数宣言となり、それ以外なら関数は式であると言える。
– 式として評価させる理由は「関数宣言のままだと関数呼び出し演算子の( )を使うことができないから」で、関数を式として評価させる方法は「functionキーワードを行の先頭におかない」こと。

## ユースケース

> * [JavaScriptで即時関数を使う理由 – Qiita](http://qiita.com/katsukii/items/cfe9fd968ba0db603b1e)
> * [即時関数のメリットと主な用途｜もっこりJavaScript｜ANALOGIC（アナロジック）](http://analogic.jp/immediate-function/)

– ページの初期化
– 機能判定
– プライベートプロパティ／メソッドの定義

“`javascript
‘use strict’;
var counter = (function() {
var count = 0;
return {
increment: function() {
return count += 1;
},
decrement: function() {
return count -= 1;
}
}
})();
console.log(counter.increment()); // 1
console.log(counter.increment()); // 2
console.log(counter.decrement()); // 1
console.log(counter.count); // undefined
“`

## ES2015(ES6)の即時関数

> * [ES2015(ES6)の即時関数は短く書けるしletならそもそも不要 | iwb.jp](http://iwb.jp/es2015-es6-immediate-function-let/)

“`javascript
let a = ‘foo’;
let b = ‘bar’;
{
let a = 1;
let b = 2;
function add(a, b) {
return console.log(a + b); // 3
}
add(a, b);
}
console.log(a + b); // foobar
“`

## 即時関数 と jQuery.ready イベント関数は別物

> * [[JavaScript] 3. 即時関数 と jQuery.readyイベント関数 – Qiita](http://qiita.com/Koizumi-Greenwich/items/d192ad98ca8b2449e4fd)
>
> JavaScriptの記述でとてもよく似ていて間違いや誤解をされやすいのが、 即時関数 と jQueryの readyイベント関数 です。

### 即時関数

– 「即時に実行、処理される関数」。これは JavaScript の実装 で jQuery とは無関係。

“`javascript
(function(仮引数, …) {
})(引数)
“`

### ready イベント関数

– jQuery に実装されているイベント処理関数。HTMLドキュメントが全てロードされ、DOMにアクセスができる準備が完了した後に処理される。すなわち「全てのロードが完了した後に実行」される。

“`javascript
$(document).ready(function() {
})
“`
[/markdown]