JavaScript 設計模式之----單體（單例）模式，javascript設計模式

JavaScript 設計模式之----單體（單例）模式，javascript設計模式
設計模式之—-單體（單例）模式1、介紹

從本章開始，我們會逐步介紹在JavaScript裡使用的各種設計模式實現，在這裡我不會過多地介紹模式本身的理論，而只會關注實現。OK，正式開始。

在傳統開發工程師眼裡，單例就是保證一個類只有一個執行個體，實現的方法一般是先判斷執行個體存在與否，如果存在直接返回，如果不存在就建立了再返回，這就確保了一個類只有一個執行個體對象。在JavaScript裡，單例作為一個命名空間提供者，從全域命名空間裡提供一個唯一的訪問點來訪問該對象。

2、 簡單單體與閉包單體

在JavaScript裡，實現單例的方式有很多種，其中最簡單的一個方式是使用對象字面量的方法，其字面量裡可以包含大量的屬性和方法：

<!DOCTYPE html><html><head>    <meta name="name" content="content" charset="utf-8">    <title>javascript單體模式</title></head><body>    <script>    //單體模式（sigleton）--無法new();因為他已經真是存在了    /*1、簡單單體--對象自變數的模式*//*  var Sigleton ={       attr1 : true,       attr2 : 10,       method1: function(){       alert("我是方法1");},method2 : function(){    alert("我是方法2");}    };    alert(Sigleton.attr1);    //單體模式主要是劃分命名空間，區分不同人之間的代碼    var BHX =BHX || {};    BHX.Sigleton ={        attr1 : true,attr2 : 10,method1: function(){alert("我是方法1");},method2 : function(){    alert("我是方法2");}    };    BHX.Sigleton.method1();*/    /*2、閉包單體---借用閉包穿簡單體（閉包的主要目的：保護資料）*/    //命名空間--塊級範圍的實現 /*     (function test(){            alert(11);        })()*/    var BHX = BHX || {};    BHX.Sigleton2=(function(){    //用閉包的作用就是把自己的私人屬性給封裝起來，不讓外界訪問。只有return暴露出來才能訪問。        var a1 = true;        var a2 = 10;        var f1 = function(){            alert("function f1");        };        var f2 = function(){            alert("function f2");        };        //要把塊級範圍的東西賦值給Sigleton2，要有return語句。        return{            attr1 : true,    attr2 : 10,    method1: function(){    return f1();    },    method2 : function(){        return f2;    }    };    })();    alert(BHX.Sigleton2.attr1);    BHX.Sigleton2.method1();    </script></body></html>

上面的代碼很不錯了，但如果我們想做到只有在使用的時候才初始化，那該如何做呢？為了節約資源的目的，我們可以另外一個建構函式裡來初始化這些代碼，如下：

3、 惰性單體和分支單體

<!DOCTYPE html><html><head>    <title>javascript 單體模式2</title></head><body><script>    /*3、惰性單體---（和閉包單體有一些相似的地方）但是可以用變數來控制要返回那些內容，而不是所有的都返回，這樣在大項目中很有好處*/    //命名空間    var BHX = BHX || {};    BHX.Base =(function(){        //利用私人變數控制 返回的單體對象        var uniqueInstance; //undefined        //需要一個構造器init 初試化對象的方法        function init(){            var a1 = true;            var a2 = 10;            var f1 = function(){                alert("function f1");            };            var f2 = function(){                alert("function f2");            };            return{                attr1 : true,                attr2 : 10,                method1: function(){                    return f1();                },                method2 : function(){                    return f2;                }            };        };        return {            getInstance:function(){                if (!uniqueInstance) { //如果不存在，則建立單體執行個體                    uniqueInstance =init();                };                return uniqueInstance;            }        };    })();    //BHX.Base.getInstance().method1();    /*4、分支單體--和swich  if else類似，可以用於底層架構瀏覽器的差異性檢測*/    var Ext =Ext ||{};    var diff = true;    Ext.More =(function(){        var ObjA={          //Firefox瀏覽器            //屬性1            attr1:"Firefox屬性1"            //屬性2            //方法1            //方法2        };        var ObjB={            //屬性1            attr1:"IE屬性1"            //屬性2            //方法1            //方法2        };        return (diff)? ObjA : ObjB;    })();    alert(Ext.More.attr1);</script></body></html>

知道了單例如何?了，但單例用在什麼樣的情境比較好呢？其實單例一般是用在系統間各種模式的通訊協調上，下面的代碼是一個單例的最佳實務：

4、 最佳實務

var SingletonTester = (function () {    //參數：傳遞給單例的一個參數集合    function Singleton(args) {        //設定args變數為接收的參數或者為空白（如果沒有提供的話）        var args = args || {};        //設定name參數        this.name = 'SingletonTester';        //設定pointX的值        this.pointX = args.pointX || 6; //從接收的參數裡擷取，或者設定為預設值        //設定pointY的值        this.pointY = args.pointY || 10;    }    //執行個體容器    var instance;    var _static = {        name: 'SingletonTester',        //擷取執行個體的方法        //返回Singleton的執行個體        getInstance: function (args) {            if (instance === undefined) {                instance = new Singleton(args);            }            return instance;        }    };    return _static;})();var singletonTest = SingletonTester.getInstance({ pointX: 5 });console.log(singletonTest.pointX); // 輸出 5 

5、其他實現方式

參考可見部落格：(http://www.cnblogs.com/TomXu/archive/2012/02/20/2352817.html)

著作權聲明：本文為博主原創文章，未經博主允許不得轉載。