IIFE は訳すと即時実行関数式。 即ち、2 個の条件がつく。
- 即時実行する
- 表現式である。宣言ではない
(function () {
console.log('IIFE')
})()
実行すると IIFE がすぐ出力される。()で囲むことで IIFE となる。
(function () {
console.log('IIFE')
})()
((function () {
console.log('IIFE')
})())
単純にスタイルの違い として見なされる 2 種類の表現と Arrow 関数がある。ES2015(ES6)。
(() => console.log('IIFE'))()
ただ、この場合次のような表現は不可
(() => console.log('IIFE')())
IIFE を使う理由は普通、Global Scope を汚染させたくないためである。つまり、変数を Global Scope に宣言することを避けること。
IIFE の中で Closure を作ると private Data を作ることができ、これは外部から接近できない。
const getCount = (function () {
let count = 1
return function () {
++count
return count
}
})()
console.log(getCount()) // 2
console.log(getCount()) // 3
IIFE の中の匿名関数は Closure となり、変数count
は private Data で使える。Module がこのような方式に依存する。
同じ Global variable を使う 2 つの Library を使う時、Bug を防ぐために使うことができる。jQuery の場合 $
という Global variable をもっているが、他の Library が$
を使う時は次のように問題を解決できる。
window.$ = funciton(){}
(function($){...})(jQuery)
UglifyJS は Javascript の最小化を使って最適化をする。ここには変数名などを短くするのも含まれている。
(function(window, document, undefined) {...})(window, document)
上を下のようにし、File の Size を圧縮できる。
(function(w, d, u) {...})(window, document)