JS單例模式在工作中的使用

　　為了盡可能的減少全局變量的污染，在寫js的時候可以采用單例模式，形式如下：

　　比如有一個js叫demo.js，那么我們可以在js里這樣寫：

var demo = {}

　　這樣做的目的是將整個js當成一個對象，這樣暴露在外的全局變量就只有demo這一個命名，不像我們平常寫直接寫很多函數，這都是對全局空間的一種污染，一旦項目中別人也取了同樣的名稱，那么就容易出問題了。

function xxx1(){}
function xxx2(){}
function xxx3(){}

　　同時為了方便維護管理js，還可以對demo內部進行划分模塊，可以按照頁面划分，也可以按照具體功能模塊划分。

　　比如按照頁面划分的寫法：

var demo = {
      page1: {
          setSlide:function(){
              //這里去進行輪播圖的相關設置
          }
      },
      page2: {    
          setSlide:function(){
              //這里去進行輪播圖的相關設置
          }
      }
}

　　可以看到，如果單純按照頁面去划分，那么頁面與頁面的之間的js可以分離的很清楚，但是也有一個弊端，即如果兩個甚至多個頁面擁有相同的功能，那么會需要去調用其它頁面的js，這樣不是很利於維護。

　　所以我們還可以按照功能+頁面混合模式來划分模塊，例如：

var demo = {
    // 將所有的公用功能抽離集成在一個模塊里
    base:{
        setSlide: function(){
            // do something
        }
    },
    page1: {
        _setSlide: function(){
            // 直接調用通用方法
            demo.base.setSlide();
        }
    },    
    page2: {
        _setSlide: function(){
            // 直接調用通用方法
           demo.base.setSlide();
        }
    }
} 

 

　　以上代碼只是舉個例子，我們可以進一步完善一下:

var demo = {
    // 將所有的公用功能抽離集成在一個模塊里
    base:{
        setSlide: function(){
            // do something
        }
    },
    page1: {
        Init: function(){
            this._setSlide().verify();
        },
        _setSlide: function(){
            // 直接調用通用方法
            demo.base.setSlide();
            //還可以做其他事情
            ......
            // 返回this,那么就能實現鏈式調用了
            return this;
        },
        verify:function(){
            //做些事情
            ......
        }
    },    
    page2: {
        Init: function(){
            this._setSlide();
        },
        _setSlide: function(){
            // 直接調用通用方法
            demo.base.setSlide();
            //還可以做其他事情
        }
    }
}  

 

　　可以看到，我們在每個頁面模塊里增加了一個Init方法，我們可以叫它頁面初始化方法，它的作用就是集中調用其它方法，相當於這個頁面的入口，這樣我們只要看到這個方法就大概能知道我們調用了哪些方法了，而不需要在頁面里去分別的調用。維護起來更方便些。

　　關於在工作中使用單例模式的方法就說到這了，有不足的地方歡迎大神指點，有不懂的地方歡迎留言。