要するに
概要
最も簡単な形式では、この手法はコードを関数スコープ内にラップすることを目的としています。
以下の可能性を減らすのに役立ちます。
- 他のアプリケーション/ライブラリとの衝突
- 優れた（世界で最も可能性が高い）範囲を汚染する
それはしない文書の準備ができたときを検出-それはいくつかの種類ではありませんdocument.onloadやwindow.onload
通常、Immediately Invoked Function Expression (IIFE)またはとして知られていSelf Executing Anonymous Functionます。
コードの説明
var someFunction = function(){ console.log('wagwan!'); };
(function() { /* function scope starts here */
console.log('start of IIFE');
var myNumber = 4; /* number variable declaration */
var myFunction = function(){ /* function variable declaration */
console.log('formidable!');
};
var myObject = { /* object variable declaration */
anotherNumber : 1001,
anotherFunc : function(){ console.log('formidable!'); }
};
console.log('end of IIFE');
})(); /* function scope ends */
someFunction(); // reachable, hence works: see in the console
myFunction(); // unreachable, will throw an error, see in the console
myObject.anotherFunc(); // unreachable, will throw an error, see in the console
上記の例では、関数で定義された（つまりを使用して宣言された）変数はすべてvar「プライベート」になり、関数スコープ内でのみアクセスできます（Vivin Paliathによると）。つまり、これらの変数は、関数の外からは見えず、到達することもできません。ライブデモをご覧ください。
Javascriptには関数スコープがあります。「関数で定義されたパラメータと変数は関数の外からは見えません。また、関数内のどこかで定義された変数は関数内のどこからでも見えます。」（「Javascript：良い部分」から）。
もっと詳しく
代替コード
最後に、前に投稿されたコードは次のように実行することもできます。
var someFunction = function(){ console.log('wagwan!'); };
var myMainFunction = function() {
console.log('start of IIFE');
var myNumber = 4;
var myFunction = function(){ console.log('formidable!'); };
var myObject = {
anotherNumber : 1001,
anotherFunc : function(){ console.log('formidable!'); }
};
console.log('end of IIFE');
};
myMainFunction(); // I CALL "myMainFunction" FUNCTION HERE
someFunction(); // reachable, hence works: see in the console
myFunction(); // unreachable, will throw an error, see in the console
myObject.anotherFunc(); // unreachable, will throw an error, see in the console
ライブデモをご覧ください。
ルーツ
反復1
ある日、誰かが「すぐに実行するだけでよいので、 'myMainFunction'に名前を付けないようにする方法があるはずだ」と考えた可能性があります。
基本に戻ると、次のことがわかります。
expression：値に評価されるもの。すなわち3+11/xstatement：何かを実行するコード行ですが、値に評価されません。すなわちif(){}
同様に、関数式は値に評価されます。そして、1つの結果（私はそう思いますか？）はすぐに呼び出せるということです。
var italianSayinSomething = function(){ console.log('mamamia!'); }();
したがって、より複雑な例は次のようになります。
var someFunction = function(){ console.log('wagwan!'); };
var myMainFunction = function() {
console.log('start of IIFE');
var myNumber = 4;
var myFunction = function(){ console.log('formidable!'); };
var myObject = {
anotherNumber : 1001,
anotherFunc : function(){ console.log('formidable!'); }
};
console.log('end of IIFE');
}();
someFunction(); // reachable, hence works: see in the console
myFunction(); // unreachable, will throw an error, see in the console
myObject.anotherFunc(); // unreachable, will throw an error, see in the console
ライブデモをご覧ください。
反復2
次のステップは、「var myMainFunction =私たちがそれを使用しないのならなぜあるのか！？」という考えです。
答えは簡単です。以下のように削除してみてください。
function(){ console.log('mamamia!'); }();
ライブデモをご覧ください。
「関数宣言は起動できない」ため、機能しません。
トリックは、削除するvar myMainFunction =ことで関数式を関数宣言に変換したことです。詳細については、「リソース」のリンクを参照してください。
次の質問は、「なぜそれを関数式として保持できないのvar myMainFunction =ですか？
答えは「あなたができる」で、あなたがこれを行うことができます多くの方法実際にあります追加+、!、-、または多分（それは今大会で行うのと）括弧のペアで包み、そしてより多くの私は信じては。例として：
(function(){ console.log('mamamia!'); })(); // live demo: jsbin.com/zokuwodoco/1/edit?js,console.
または
+function(){ console.log('mamamia!'); }(); // live demo: jsbin.com/wuwipiyazi/1/edit?js,console
または
-function(){ console.log('mamamia!'); }(); // live demo: jsbin.com/wejupaheva/1/edit?js,console
したがって、「代替コード」であったものに関連する変更が追加されると、「コードの説明」の例で使用されたものとまったく同じコードに戻ります。
var someFunction = function(){ console.log('wagwan!'); };
(function() {
console.log('start of IIFE');
var myNumber = 4;
var myFunction = function(){ console.log('formidable!'); };
var myObject = {
anotherNumber : 1001,
anotherFunc : function(){ console.log('formidable!'); }
};
console.log('end of IIFE');
})();
someFunction(); // reachable, hence works: see in the console
myFunction(); // unreachable, will throw an error, see in the console
myObject.anotherFunc(); // unreachable, will throw an error, see in the console
についてもっと読むExpressions vs Statements：
スコープの謎を解く
「関数内で変数を「適切に」定義しないとどうなりますか？代わりに単純な代入を行いますか？」
(function() {
var myNumber = 4; /* number variable declaration */
var myFunction = function(){ /* function variable declaration */
console.log('formidable!');
};
var myObject = { /* object variable declaration */
anotherNumber : 1001,
anotherFunc : function(){ console.log('formidable!'); }
};
myOtherFunction = function(){ /* oops, an assignment instead of a declaration */
console.log('haha. got ya!');
};
})();
myOtherFunction(); // reachable, hence works: see in the console
window.myOtherFunction(); // works in the browser, myOtherFunction is then in the global scope
myFunction(); // unreachable, will throw an error, see in the console
ライブデモをご覧ください。
基本的に、現在のスコープで宣言されていない変数に値が割り当てられている場合、「変数が見つかるか、グローバルスコープに到達するまで（スコープが作成される）、スコープチェーンのルックアップが行われます」。
ブラウザー環境（nodejsのようなサーバー環境に対して）の場合、グローバルスコープはwindowオブジェクトによって定義されます。したがって、私たちは行うことができますwindow.myOtherFunction()。
このトピックに関する私の「グッドプラクティス」のヒントは、何かを定義するときに常に使用varすることですです。それが数値、オブジェクト、または関数であるかどうか、さらにはグローバルスコープ内であってもです。これにより、コードがはるかに簡単になります。
注意：
- javascriptにはありません
block scope（更新：ES6で追加されたブロックスコープのローカル変数た）。
- javascriptには
function scope＆global scope（windowブラウザ環境ではスコープ）しかない
についてもっと読むJavascript Scopes：
資源
次のステップ
このIIFE概念をmodule pattern理解したら、それはにつながります。これは、通常、このIIFEパターンを利用することによって行われます。楽しんで ：）