如何做JS 單體模式的設計---->>js設計模式<<-------單體模式

來源:互聯網
上載者:User

標籤:缺點   replace   組織   執行個體   page   重要   err   數組   底線   

1. 單體模式是js中最基本 單最有用的模式之一,非常常用。

單體模式的基本結構如下:

var Person = {         name: ‘lilu‘,         age:‘20‘,         sayHi: function(){            alert(‘456456‘);          },         sayBye: function(){            alert(‘456456‘);          }    }

這個栗子中,所有的成員都可以通過Person進行訪問,用點運算子就行。

如:

Person.name = "zczc";Person.age = "1000";var hi = Person.sayHI();

我們可以為這個單體對象添加新的成員變數或者方法,意味著這個對象可以被修改。這麼做,違背2了面相對象設計的一條原則:---->>類可以被擴充,但不應該被修改<<------。

那麼什麼才是真正的單體模式?

先看定義:單體是一個用來劃分命名空間並將一批相關方法和屬性群組織在一起的對象,如果它可以被執行個體化,那麼它只能被執行個體化一次。

對象字面量只是建立單體的方法之一,並非所有對象字面量都是單體。如果它只是用來類比數組或儲存資料,顯然不是單體。主要看我們的意圖。

2. 單體對象有兩部分組成:包含著方法和屬性的成員對象自身,以及用於訪問它的變數。這個變數同事是全域的。  以便於在網頁上任何地方都能訪問它所指向的單體對象。雖然說按照定義單體不一定必須是全域的,但是它應該在各個地方都能被訪問。由於這些成員只能通過這個單體物件變數進行訪問,在某種意義上說,它們被單體對象全在了一個命名空間中。

3.命名空間 的理解

// 聲明全域屬性function Hell() {   // .....}// 頁面中其他方法var Hell = $(‘dakjka‘); //Hell 方法在這裡被改變

函數中使用var 聲明很重要,如果不用,那麼變數將被聲明為全域屬性,因此容易幹擾全域命名空間中的其他代碼。

改寫為如下代碼:

var myFun = {    Hell: function(){     // code gose here     }}var Hell = $(‘fsfs‘); // Nothing was chenged 

現在Hell是myFun中的一個方法,不會別全域命名空間中的任何新變數改寫。

命名空間還可以進一步分割。 網頁上的JS 代碼不止有一個來源。除了我們的代碼,還有庫代碼,廣告代碼之列,這些變數都出現在網頁的全域命名空間中。為了防止衝突,我們可以定義一個包含自己所有代碼的全域對象。

var MyCode = {};

然後分門別類將自己的代碼和資料群組織到全域對象的各個對象中:

var MyCode  = {};MyCode.common = {   // 一個單體對象,包含公用的方法 }MyCode.Error = {  //  用來儲存資料}MyCode.PageHandler = {  //  用來操作頁面的方法和屬性}

4. 建立私人成員--->>使用私人方法有一個缺點--比較耗費記憶體,因為每個執行個體都具有一個方法的副本。

01.用底線表示私人成員

MyCode.Data = {// 私人成員   _spave:function(str){       return  str.replace(‘‘‘‘)    }// 共有方法    test:function(){    console.log(‘this is common method‘)   }}

02.使用閉包

var MyCode = function() {    return {};}()

匿名函數返回一個對象,賦給MyCode;

也可以寫作:

var MyCode = (function(){    return {};})()

我們可以擺共有成員添加到作為單體返回的那個對象字面量中

var MyCode.Data = (function(){  return {    hell: function(){};    Bye: function(){};   }})();

如果這樣寫得到的結果跟使用一個對象字面量沒有什麼區別,那為什麼還要加上外層函數封裝呢?

原因就在於這個封裝函數建立了一個可以用來添加真正的私用成員的閉包。任何聲明在這個匿名函數中的變數或者函數都只能被在同一個閉包中聲明的其他函數訪問。這個閉包在匿名函數執行結束後依然存在,所以在其中聲明的變數和函數總是能從匿名函數所返回的對象內部訪問。

var MyCode.Data = (function(){  // 私人  var name = "lilu";  var age = "20";  function print(){  console.log(213); } //共有  return {    say:function(){    alert(123);     };    rel:function(){        alert(4563);     }  }})    

這些在return 中的方法都是共有方法,可以直接方位私人屬性,而不用再前面加this.  -->這個首碼只用於訪問單體對象的公用成員。

 

如何做JS 單體模式的設計---->>js設計模式<<-------單體模式

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.