2017-02-16 7 views
3

私は両方の方法で書かれた同じコードを見てきましたが、それらの間にトレードオフがあるのだろうかと思います。グローバル変数を関数に渡す理由は何ですか?

方法1:

(function(i) { 
    // Do something to i now 
}(global_variable)) 

方法2:とにかくそのスコープに存在することが起こっている場合

(function() { 
    // Do something to global_variable now 
}()) 

は、なぜあなたは関数にグローバル変数を渡すのでしょうか?

+2

最初のコードブロックは関数内で 'global_variable'ではなく' i'を使用する必要があります。 – Barmar

+0

この変数を参照するとパフォーマンスが向上します。 JavaScriptでは、変数のスコープが近ければ近いほど、使用するのが速くなります。競合を避けるために – David

+1

。後で 'global_variable'に格納されているリファレンスを置き換えると、iife内のコードは気にしません。 –

答えて

3

この場合、この関数ではグローバルを使用し、エイリアスを入力しやすいという明確な指示があります。また、グローバルスコープ内でスコープを検索するまで、すべてのスコープを検索する必要がないため、変数へのアクセスが少し速くなります。

あなたの例のように通常の関数の場合、iifeではなく、より簡単に渡されるグローバルをモックすることができるので、関数をよりテスト可能にします。例えば目的のエイリアシングのために

+0

@rasmeisterここでコメントを削除してください。 –

1

(function(leeloo){ 

    //inside here you can use the short term 

})(LeeloominaiLekataribaLaminaTchaiEkbatDeSebat) 

//this would be similar, it's a matter of preference 
(function(){ 
    var leeloo = LeeloominaiLekataribaLaminaTchaiEkbatDeSebat; 

    //... 
})() 

またはこの例のように、値を囲む:

(function($){ 

    //in here, $ preserves the passed/injected value, 
    //even if the global value changes 

})(jQuery.noConflict()) 

あなたも同じページにjQueryの複数のバージョンを使用することができますこの方法。

+1

2番目のケースでは、iife内で非同期の処理を行っていた場合にのみこれを行うほうが有益でしょう。そうしないと、保存する理由はありません。しかし、これはほとんどの場合、常にjqueryの場合です。 –

+0

@KevinB 'iife内で何か非同期を実行する' ... jqueryの主な使用例の1つであるユーザーのやりとりを含むようなもの)。ええ、jqueryはこれのための最良の例ではありませんが、多くのものを作ることなく私の心に来る最高*(ジェネリックに滞在)*。グローバル変数に何が起こっても、渡された値をカプセル化して保持するためには、アイフルをクロージャーとして使用しています。 – Thomas

+0

正確に。 jqueryを使用すると、最もよくバインドされるイベントになり、非同期アクションが実行されます。それは良い例です(たとえ '$(function($){...}) 'を使っても同じことができます) –

1

global_variableの値を何らかの理由で恒久的に変更したくない場合は、最初の例を使用します。例えば。このコードを実行すると、ローカルコピーは変更されますが、グローバル変数は変更されません。

global_variable=true; (function(i){ i=false; return i; }(global_variable)); 

しかし、このコードは、明らかにglobal_variable変更:

global_variable=true; (function(){ global_variable=false; }()); 

編集:それはグローバル変数を変更ように、それは機能を呼び出すと、シャドウコピーを作成していないので、多少接線方向に、この変化が見えますグローバル変数の

g=true; (function(g){ g=false; return g; }(g)); 
関連する問題