現(xiàn)總結(jié)一下Javascript創(chuàng)建類(lèi)和對(duì)象的幾種方法：

1、原始的創(chuàng)建方法：

<script type="text/javascript">
  var person = new Object();
  person.name="Amy";
  person.sex="Woman";
  person.show=function(){
    document.write("name is: "+this.name+" ; sex is:"+this.sex);
  }
  person.show(); 
</script>

原始的創(chuàng)建方法對(duì)于熟悉面向?qū)ο蟮娜藖?lái)說(shuō)難以接受，總感覺(jué)屬性和方法的封裝不是很緊密，這種封裝是以“對(duì)象名”+“.”的方式進(jìn)行，表示對(duì)象名后跟的屬性和方法是這個(gè)對(duì)象擁有的東西，這個(gè)對(duì)象（例如：person）就是封裝好的結(jié)果，你可以繼續(xù)追加方法和屬性，例如追加age屬性：person.age=23;這種創(chuàng)建方法會(huì)讓熟悉Java編程的人感到很難受。我們可以對(duì)原始的創(chuàng)建方法進(jìn)一步“封裝”一下，請(qǐng)看下一步：

2、工廠方法模式：

 <script type="text/javascript">
   function personFactory(name,age,sex){
     var ob=new Object();
     ob.name=name;
     ob.age=age;
     ob.sex=sex;
     ob.show=function(){
       document.write(ob.name+" "+ob.age+" "+ob.sex);
     }
     return ob;
   }
   var person=personFactory("Amy",21,"Woman");
   person.show();
 </script>

工廠方法模式看起來(lái)更像一個(gè)類(lèi)了，personFactory對(duì)原始的創(chuàng)建方法進(jìn)行了封裝，并將創(chuàng)建好的對(duì)象返回給person引用變量，person就可以引用這個(gè)創(chuàng)建好的對(duì)象了，但是還不夠完美：你每一次創(chuàng)建一個(gè)對(duì)象， 并使用該對(duì)象調(diào)用show()方法時(shí)，都會(huì)創(chuàng)建新的show()函數(shù)，它們完全可以調(diào)用同一個(gè)show方法，優(yōu)化方法是將show放到工廠外，如下：

 <script type="text/javascript">
   function show(){
     document.write(this.name+" "+this.age+" "+this.sex);
   }
   function personFactory(name,age,sex){
     var ob=new Object();
     ob.name=name;
     ob.age=age;
     ob.sex=sex;
     ob.show=show;
     return ob;
   }
   var person=personFactory("Amy",22,"Woman");
   person.show();
 </script>

從功能上說(shuō)，上面的代碼解決了函數(shù)重用問(wèn)題，但是呈現(xiàn)方式不像是創(chuàng)建一個(gè)對(duì)象，熟悉Java的人仍感到難受。請(qǐng)看下一步：

3、構(gòu)造方法模式：

 <script type="text/javascript">
   function person(name,age,sex){
     this.name=name;
     this.age=age;
     this.sex=sex;
     this.show=function(){
       document.write(this.name+" "+this.age+" "+this.sex);
       document.write("<br>");
     }
   }
   var per=new person("Amy",22,"Woman");
   per.show();
 </script>

上述代碼的創(chuàng)建方式已經(jīng)與Java類(lèi)和對(duì)象的創(chuàng)建方式幾乎一樣了，封裝好類(lèi)的屬性和方法，然后利用new關(guān)鍵字創(chuàng)建并返回一個(gè)對(duì)象，這不就是Java創(chuàng)建類(lèi)和對(duì)象的過(guò)程嗎，是的，就是這個(gè)過(guò)程，但是還可以?xún)?yōu)化，這種方式創(chuàng)建的對(duì)象調(diào)用show方法是也會(huì)即時(shí)地創(chuàng)建一個(gè)show函數(shù)，我們能不能創(chuàng)建一個(gè)所有對(duì)象公用的一個(gè)方法呢？就像Java類(lèi)中的static方法一樣，所有對(duì)象都使用同一個(gè)static方法，答案是可以的。請(qǐng)看下一步：

4、動(dòng)態(tài)原型方法：

 <script type="text/javascript">
   function Person(name,age,sex){
     this.name=name;
     this.age=age;
     this.sex=sex;
     if(typeof Person.tag == "undefined"){
       Person.prototype.show=function(){
         document.write(this.name+" "+this.age+" "+this.sex);
         document.write("<br>");
       }
       Person.tag=true;
     }
   }
   var per=new Person("Peter",22,"Man");
   per.show();
 </script>

這里使用了一點(diǎn)技巧，當(dāng)用new創(chuàng)建對(duì)象是，會(huì)執(zhí)行Person功能塊中的if判斷語(yǔ)句，順序從上往下，剛開(kāi)始tag變量當(dāng)然沒(méi)有定義，所以執(zhí)行if語(yǔ)句塊里的內(nèi)容：

Person.prototype.show=function(){
 document.write(this.name+" "+this.age+" "+this.sex);
 document.write("<br>");
 }

這段內(nèi)容的含義是創(chuàng)建一個(gè)屬于類(lèi)Person的show方法，注意，它是一個(gè)類(lèi)方法，相當(dāng)于Java中static修飾后的方法，而非單個(gè)對(duì)象的方法，這樣所有的對(duì)象均可調(diào)用同一個(gè)方法了，這樣也不用每次不同對(duì)象調(diào)用方法是都創(chuàng)建自己的show函數(shù)了，既節(jié)省空間又節(jié)省時(shí)間，這種方法豈不更妙。這里解釋一下，以“類(lèi)名.prototype.屬性/方法”方式構(gòu)造的屬性和方法相當(dāng)于Java中用static修飾的變量或方法，是屬于整個(gè)類(lèi)的，而非單個(gè)的對(duì)象，也即所有對(duì)象是共享的。

以上是學(xué)習(xí)JS類(lèi)和對(duì)象的總結(jié)，其中個(gè)人理解錯(cuò)誤之處還望大家批評(píng)指正。

最新評(píng)論