javascript物件導向與原型

 1 //一.原廠模式 2   function createBox(user,age){ 3       var obj=new Object(); 4       obj.user=user; 5       obj.age=age; 6       obj.run=function(){ 7           return this.user+this.age+"原型在哪裡！"; 8       }; 9       return obj;10   }11   var obj1=createBox("mly",20);12   alert(obj1.run());13   var obj2=createBox("zs",21);14   alert(obj2.run());15   alert(obj1 instanceof Object);//true16   alert(obj2 instanceof Object);//true17   //原廠模式缺點:不能解決對象識別問題，因為根本無法搞清楚他們到底是哪個對象的執行個體。

 1  //二.建構函式模式 2   function Box(user,age){ 3     this.user=user; 4     this.age=age; 5     this.run=function(){ 6         return this.user+this.age+"原型在哪裡！"; 7     }; 8   } 9   var box1=new Box("mly",12);10   alert(box1.run());11   var box2=new Box("mly",12);12   alert(box1.run() == box2.run()); //true，方法的值相等，因為傳參一致13   alert(box1.run == box2.run); //false，方法其實也是一種引用地址14   //缺點：他們引用地址不同

 1  //三.原型模式 2   //在原型模式聲明中，多了兩個屬性，這兩個屬性都是建立對象時自動產生的。__proto__ 3   //屬性是執行個體指向原型對象的一個指標，它的作用就是指向建構函式的原型屬性constructor 4   //通過這兩個屬性，就可以訪問到原型裡的屬性和方法了。

 5   //模式1 6   function Box(){ 7       this.age=10; 8   } 9   Box.prototype.user="mly";10   Box.prototype.age=12;11   Box.prototype.family=["哥哥","弟弟","妹妹"];12   Box.prototype.run=function(){13     return this.user+this.age+"原型在哪裡！";14   };15   var box1=new Box();16   alert(box1.run());17   alert(Box.prototype.isPrototypeOf(box1));//true 證明每個執行個體化後對象都有原型18   alert(box1.hasOwnProperty("user"));//false 判斷user屬性是否在執行個體對象中，false表示不再19   alert("user" in box1)//true 只要存在執行個體或者原型中就返回true20   //如何判斷只在原型中呢？21   function IsPrototype(box,para){22     return (!box.hasOwnProperty(para))&&(para in box);23   }24   alert(IsPrototype(box1,"user"));//只在原型中25   alert(box1.age);//12 證明如果執行個體中有，會覆蓋原型26   alert(box1.family);//列印出：哥哥,弟弟,妹妹27   box1.family.push("姐姐");28   alert(box1.family);//列印出：哥哥,弟弟,妹妹,姐姐29   var box2=new Box();30   alert(box2.family);//列印出：哥哥,弟弟,妹妹,姐姐31   //給String自訂一個方法psString32   String.prototype.psString=function(){33     return this+"剛剛加的方法！";34   };35   alert("mly".psString());//列印出   mly剛剛加的方法！36   //缺點：資料共用的緣故，當然這也是原型的優點37   //模式2:字面量方式38   function Desk(){}39   Desk.prototype={     //重寫原型40       constructor:Desk,//直接強制指向Desk執行個體41       user:"mly",42       age:12,43       run:function(){44         return this.user+this.age+"原型在哪裡！";45       }46   };47   var desk1=new Desk();48   alert(desk1.age);49   //如果重寫原型50   Desk.prototype={51     age:121252   }53   var desk2=new Desk();54   alert(desk1.run());//不報錯，證明該對象已到記憶體中55   alert(desk2.run());//報錯  找不到run()方法，證明該原型切斷了與之前的連結被重寫了

 

 1  //四.建構函式+原型模式 2  function Box(user,age){ 3     this.user=user; 4     this.age=age; 5  } 6  Box.prototype={ 7     constructor:Box, 8     run:function(){ 9         return this.user+this.age+"原型在這裡！";10     }11  };12  var box1 =new Box("mly",123);13  alert(box1.run());//mly123原型在這裡！14  //這種混合模式很好的解決了傳參和引用共用的大難題。是建立對象比較好的方法。但是你不覺得有點奇怪嗎？為什麼不寫到一起呢？

 1  //五.動態原型模式 2   function Box(user,age){ 3     this.user=user; 4     this.age=age; 5     if(typeof this.run!="function"){//原型是共用的執行個體化調用一次就好了，以後執行個體化不用調用 6         Box.prototype.run=function(){ 7             return this.user+this.age+"動態原型模式!"; 8         }; 9     }10   }11   var box1=new Box("mly",123);12   alert(box1.run());//mly123動態原型模式!13   var box2=new Box("zs",444);14   alert(box2.run());//zs444動態原型模式!15   //使用動態原型模式，要注意一點，不可以再使用字面量的方式重寫原型，因為會切斷執行個體和新原型之間的聯絡。

以上就是有關原型的幾種模式了，各位可以根據自己的實際情況選相應的模式。