好程式設計師教程分享Javascript設計模式

方法一 物件字面量表示法
　　在物件字面量表示法中，一個物件被描述為一組包含在大括號中，以逗號分隔的 name/value 對。物件內的名稱可以是字串或識別符號，後面跟著一個冒號。物件中最後一個 name/value 對不加逗號，否則會出錯。

/**

1. <p><font size="3">　　* 使用字面量表示法定義模組</font></p>
2. <p><font size="3">　　*/</font></p>
3. <p><font size="3">　　var myModule = {</font></p>
4. <p><font size="3">　　myProperty: "someValue",</font></p>
5. <p><font size="3">　　myConfig: {</font></p>
6. <p><font size="3">　　useCaching: true,</font></p>
7. <p><font size="3">　　language: "en"</font></p>
8. <p><font size="3">　　},</font></p>
9. <p><font size="3">　　myMethod: function () {</font></p>
10. <p><font size="3">　　console.log("the first method");</font></p>
11. <p><font size="3">　　},</font></p>
12. <p><font size="3">　　myMethod2: function () {</font></p>
13. <p><font size="3">　　console.log("the second method");</font></p>
14. <p><font size="3">　　},</font></p>
15. <p><font size="3">　　};</font></p>

console.log(myModule.myProperty); // someValue

1. <p><font size="3">　　console.log(myModule.myConfig); // {useCaching: true, language: 'en'}</font></p>
2. <p><font size="3">　　console.log(myModule.myConfig.useCaching); // true</font></p>
3. <p><font size="3">　　myModule.myMethod(); // the first method</font></p>
4. <p><font size="3">　　myModule.myMethod2(); // the second method</font></p>

　　方法二 Module模式
Module模式使用閉包封裝“私有”狀態和組織。它提供了一種包裝混合公有/私有方法和變數的方式
　　，防止其汙染全域性名稱空間，防止其洩露到全域性作用域。通過該模式，只需返回一個公有API，而其他的一切則都維持在私有閉包裡。
/**

1. <p><font size="3">　　* Module方法定義</font></p>
2. <p><font size="3">　　*/</font></p>
3. <p><font size="3">　　var myNameSpace = (function () {</font></p>
4. <p><font size="3">　　// 私有變數</font></p>
5. <p><font size="3">　　var myPrivateVar = 0;</font></p>
6. <p><font size="3">　　// 私有函式</font></p>
7. <p><font size="3">　　var myPrivateMethod = function (foo) {</font></p>
8. <p><font size="3">　　console.log(foo);</font></p>
9. <p><font size="3">　　};</font></p>
10. <p><font size="3">　　// 公有API</font></p>
11. <p><font size="3">　　return {</font></p>
12. <p><font size="3">　　// 公有變數</font></p>
13. <p><font size="3">　　myPublicVar: "foo",</font></p>
14. <p><font size="3">　　// 公有方法</font></p>
15. <p><font size="3">　　myPublicFunction: function (bar) {</font></p>
16. <p><font size="3">　　// 操作私有變數</font></p>
17. <p><font size="3">　　myPrivateVar ++;</font></p>
18. <p><font size="3">　　// 呼叫私有函式</font></p>
19. <p><font size="3">　　myPrivateMethod(bar);</font></p>
20. <p><font size="3">　　},</font></p>
21. <p><font size="3">　　// 公有方法二</font></p>
22. <p><font size="3">　　myPublicFunction2: function () {</font></p>
23. <p><font size="3">　　console.log("success");</font></p>
24. <p><font size="3">　　}</font></p>
25. <p><font size="3">　　};</font></p>
26. <p><font size="3">　　}) ();</font></p>

console.log(myNameSpace.myPrivateVar); // undefined

1.  
2. <p><font size="3">　　console.log(myNameSpace.myPrivateVar); // undefined</font></p>
3. <p><font size="3">　　console.log(myNameSpace.myPublicVar); // foo</font></p>
4. <p><font size="3">　　console.log(myNameSpace.myPublicFunction); // Function</font></p>
5. <p><font size="3">　　myNameSpace.myPublicFunction2(); // success</font></p>
6. <p><font size="3">　　myNameSpace.myPublicFunction("i am first"); // i am first</font></p><