模塊模式與構造函數

我試着將模塊模式與構造函數相結合，但它似乎我正在查找一些東西。實例化兩個對象並顯示其屬性後，兩個實例var似乎都引用同一個對象。模塊模式與構造函數

這是我放在一起的一個小例子。

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
     <title>test</title> 

     <script type="text/javascript"> 
      var guidUtils = { 
       /* Generates a simple UUID/GUID based on some randomisation. 
       * 
       */ 
       guidGenerator:function() { 
        var S4 = function() { 
         return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1); 
        }; 
        return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4()); 
       } 
      }; 


      var Car = (function() { 

       // private variables and functions 
       var thiz; 
       var ID = 'bar'; 
       var model; 

       var setID = function(id){ 
        ID = id; 
       }; 

       var getID = function(){ 
        return ID; 
       }; 

       var setModel = function(pModel){ 
        model = pModel; 
       }; 

       var getModel = function(){ 
        return model; 
       }; 

       // constructor 
       var Car = function (pModel) { 
        thiz=this; 
        ID = guidUtils.guidGenerator(); 
        model = pModel; 
        init(); 
       }; 

       //intialisation 
       function init(){ 

       } 

       // prototype 
       Car.prototype = { 
        constructor: Car, 
        getID: getID, 
        getModel: getModel 

       }; 

       // return Car 
       return Car; 
      })(); 

      function show() { 
       var car1 = new Car("audi"); 
       var car2 = new Car("BMW"); 
       var car1div = document.getElementById("car1"); 
       var car2div = document.getElementById("car2"); 
       car1div.innerHTML=car1.getID()+" is a "+car1.getModel(); 
       car2div.innerHTML=car2.getID()+" is a "+car2.getModel(); 
      } 

     </script>  
    </head 
    <body> 
     <a onclick="show()" href="javascript:void(0);">show</a> 
     <div id="car1"></div> 
     <div id="car2"></div> 
    </body> 
</html>

結果是：

screenshot of result

可能一些解釋正是我在作出錯誤的假設？

來源

2012-03-26 Peter De Winter

var thiz; 
etc... 
    // constructor 
    var Car = function (pModel) { 
     thiz=this; 
     etc...

是問題所在。這創建了一種靜態變量，由該類的所有實例共享。所有的實例方法和屬性必須綁定到原型和this。例如：

var Car = function (pModel) { 
     this.ID = guidUtils.guidGenerator(); 
     this.model = pModel; 
     this.init(); 
    }; 

    // Removed: "var setID = " Instead, bind it to the prototype: 
    Car.prototype.setId = function(id){ 
     this.ID = id; 
    };

參見：

來源

2012-03-26 19:08:28

我明白，所以封裝性能是不可能的？ – 2012-03-26 21:46:22

@Neomusashi你是什麼意思封裝？讓他們「私人」？這是可能的，但所有變量都必須在**'Car'中定義**。 – 2012-03-26 22:11:48

我想我現在明白了。謝謝。唯一的問題是我將無法使用訪問器方法公開這些私有變量，除非我將該實例作爲參數傳遞。 – 2012-03-27 08:33:35

模塊模式與構造函數

回答

相關問題