JavaScript的全球設計模式

可能重複： How to avoid global variables in JavaScript?JavaScript的全球設計模式

我正在尋找關於如何最好地在JavaScript中管理全局變量一些建議。

考慮以下幾點：

foo = 1; 
bar = 2; 

// Update our global variable 
function doStuff (newFooValue) { 
    foo = newFooValue 
} 

// Update a global based on a condition 
function doMoreStuff() { 
    if (bar == 3) { 
     foo = 1; 
    } 
}

在這兩種情況下，我們的函數內部訪問全局變量，這感覺醜陋的我。從我讀過的內容中，我們希望儘可能地避免全局變量，以避免堵塞全局名稱空間。

那麼，我們需要爲全局變量創建一個結構嗎？

例如，

var myPage = {} 
myPage.foo = 1; 
myPage.bar = 2;

我想這解決了全局命名空間衝突問題，但我還是從訪問我的方法中的全局範圍。

我該怎麼辦？

來源

2013-01-12 Jason Wells

謝謝，沒有看到。 –

爲避免全局命名空間污染，您應該將代碼包裝在Immediately Invoked Function Expression (IIFE)中。的JavaScript變量具有的功能範圍，所以它們只是他們中聲明的功能之內。

(function() { 
    //these variables only exist within the outer function 
    var foo, 
     bar; 
    foo = 1; 
    bar = 2; 

    //these functions only exist within the outer function 
    function fizz() { 
     return foo + bar; 
    } 
    function buzz() { 
     return foo - bar; 
    } 
}());

上面的例子是相當無用的，因爲所有的變量和函數被封裝並且將無法使用外部。任何函數/變量需要是全球性的，應手動添加到全局對象：

(function (g) { 
    //not repeating code from above, pretend it's here 

    //make the functions globally accessible 
    g.fizz = fizz; 
    g.buzz = buzz; 
}(this));

來源

2013-01-12 19:15:26 zzzzBov

感謝您的解釋。是的，我真的想將foo和bar變量暴露給頁面上的其他功能。是不是爲我們的全局變量創建一個足以避免碰撞的對象？ –

只有包裝對象沒有命名衝突。 – zzzzBov

包裝在一個類可能？

var myPage = {} 
myPage.foo = 1; 
myPage.bar = 2; 
myPage.doStuff = function(newFooValue) { 
    this.foo = newFooValue; 
}

然後你就可以在全局範圍內使用一個點。你應該避免這一點，但如果你需要解決全球範圍，那麼你會做到這一點。如果你問的是設計模式，你將不得不更加精確。如果您有兩個名爲doStuff和doMoreStuff的函數，那麼設計是非常困難的。

來源

2013-01-12 19:19:40 fsw

謝謝，這是我提出的解決方案。我認爲它避免了與其他全局變量的衝突。 –

JavaScript的全球設計模式

回答

相關問題