Javascript模塊模式導入

我想了解Javascript模塊模式，但我無法弄清楚添加到匿名函數和參數添加到最後的參數之間的差異。那麼有人可以幫我理解兩者之間的區別嗎？謝謝Javascript模塊模式導入

下面是一個模塊模式的例子，它實現了兩個anon。函數參數（JQ，Yahoo）以及最後顯示的模塊參數（JQuery，Yahoo）。

var modularpattern = (function(JQ, Yahoo) { 
    var sum = 0 ; 

    return { 
     add:function() { 
      sum = sum + 1; 
      return sum; 
     }, 
     reset:function() { 
      return sum = 0;  
     } 
    } 
}(JQuery, Yahoo));

來源

2014-08-31 MChan

你能告訴我們加入一個匿名函數模塊模式的一個例子嗎？ – soktinpk 2014-08-31 12:09:50

它們是相同的，但是這樣您可以創建別名而不污染外部範圍。 – Oriol 2014-08-31 12:13:24

沒有「模塊參數」這樣的東西。它們只是*函數調用的*參數* - [理解IEFE]（http://stackoverflow.com/q/8228281/1048572） – Bergi 2014-08-31 12:19:23

按道理你的代碼的工作等於：

var func = function(JQ, Yahoo) { // Section 1 
    var sum = 0 ; 

    return { 
     add:function() { 
      sum = sum + 1; 
      return sum; 
     }, 
     reset:function() { 
      return sum = 0;  
     } 
    } 
} 

var modularpattern = func(JQuery, Yahoo); // Section 2

因此，在第1節

JQ：其被用作輸入參數的函數的局部變量
雅虎：完全相同的JQ

而且在第2（在本節其實你調用該函數）

JQuery的：在全球範圍內
雅虎現有對象：完全相同在jQuery

爲什麼開發人員實現這樣的：

所有全局對象都可以在函數範圍內訪問，但訪問局部變量比全局變量快得多。（這就是所謂的本地化）

來源

2014-08-31 12:31:27

因此，這裏的'JQ'就像侷限於模塊函數範圍的局部變量，但無法從全局範圍訪問，而JQuery是可從全局範圍訪問的全局變量？如果我想將JQuery庫傳遞給此模塊，但是再次輸入JQ而不是JQuery，會發生什麼？在這一點上，編譯器不會理解我需要傳遞JQuery庫嗎？ – MChan 2014-08-31 16:59:25

@MChan第一個問題：你是完全正確的。第二個問題：因爲'JQ'沒有在全局範圍內定義，所以你會在該函數中得到'undefined'（換句話說''JQ'在這個函數中將會是'undefined'）第三個問題：是**注意** JavaScript沒有[編譯器有解釋器] – 2014-08-31 18:54:58

我不能找出在結束時加入添加到匿名函數參數和參數之間的差

加入到匿名功能的參數是名稱您在函數中給予這些東西

個
的參數在最後增加是引用對這些對象

這意味着你可以訪問一個「安全（R）」的提法，因爲它是由其他件不太容易改變使用這種模式的代碼

(function (bar) { // use bar here, not foo as it's your protected reference // but unless something else happens, bar === foo }(foo);

代碼是好幾個原因

保持命名空間乾淨

如果框架包含衝突，爲您提供了一個「安全」的環境，在這裏你可以使用默認的名稱

來源

2014-08-31 12:13:49

因此，bar就像侷限於anon func scope的局部變量，而foo就像是一個全局變量，它告訴編譯器將foo庫傳遞給這個模塊是否正確？ – MChan 2014-08-31 17:08:00

我曾與模塊模式的許多變現工作，但是這一次是最好的方法：

(function(global) { 
    var somePrivate = 'foo'; 

    function somePrivateMethod() {} 

    var myModule = function() { 
     // Your logic here 
    } 

    global.myModule = myModule; 
})(this);

來源

2014-08-31 12:36:07 ghaiklor

全局和上面這個有什麼不同？這些應該不是指那些被導入的圖書館？ – MChan 2014-08-31 17:00:43

Javascript模塊模式導入

回答

相關問題