Javascript玩轉繼承(一)

最近一直在學Javascript，打算寫一些文章，算做自己的學習心得吧，也可以算是學習筆記。沒有系統的知識點，太基礎的不想寫，主要是寫一些自己覺得有價值的地方。

今天寫第一篇。

Javascript究竟是一門物件導向的語言，還是一門支援對象的語言，我想每個人都有著自己的看法。那些Javascript忠實的Fans一定講Javascript是一門物件導向的語言，像《Javascript王者歸來》一書中對Javascript的說法是基於原型的物件導向。我談談我個人的看法。物件導向的三個特徵，繼承，多態，封裝，Javascript雖然實現起來不像Java,C#等物件導向的語言來得快，但是畢竟也有著一定的支援。因此說Javascript是物件導向的語言是有著一定道理的，但是從繼承這個部分來談，一系列的繼承法，但是每個繼承法都無法實現真正物件導向語言的威力，因此，說他物件導向有著一定的牽強。綜上，我對Javascript的理解，更願意把它叫做一種簡化的物件導向，或者說"偽"物件導向（這個偽字絕無貶義）。

今天就從物件導向這個第一個特徵：繼承來談。

什麼是繼承？這個我不想廢話，有一隻動物，有一個人，有一個女孩，這個就是一個最簡單，也是典型的繼承鏈。

在C#等物件導向中，很容易。

 

class Animal

{    }

class People:Animal

{    }

class Girl:People

{    }

 

那麼在Javascript中，沒有類，沒有繼承的提供實現，我們該怎麼做呢？

1. 對象偽裝（構造繼承法）

   什麼是對象偽裝呢？我們可能叫做構造繼承更容易理解一些。顧名思義，就是用建構函式來玩繼承。其實就是說把父類的建構函式當成是一個普通的方法，放到子類的建構函式中去執行，這樣的話，當構造對象的時候，子類的對象當然就可以構造父類的方法啦！

   還是用上面的那個例子，代碼如下：

   function Animal()

   {

           this.Run=function(){alert("I can run");};

   }

   function People(name)

   {

   //在這裡就是傳入了父類的構造方法，然後執行父類的構造方法，這個時候就//可以使用父類中的方法了。

           this.father=Animal;

           this.father();

           //記得要刪除，否則在子類添加於父類相同名稱的方法時，會修改到父類。

   delete this.Father;

   this.name=name;

           this.Say=function(){alert("My name is "+this.name);}

   }

   function Girl(name,age)

   {

           this.father=People;

           this.father(name);

           delete this.father;

           this.age=age;

           this.Introduce=function(){alert("My name is "+this.name+".I am "+this.age);};

   }

   這樣的話就實現了一個繼承鏈，測試下：

   var a=new Animal();

   a.Run();

   var p=new People("Windking");

   p.Run();

   p.Say();

   var g=new Girl("Xuan",22);

   g.Run();

   g.Say();

   g.Introduce();

   結果如下：

   a.

   b.

   c.

   d.

   e.

   f.

   測試成功！

   我們來總結一下這段代碼的關鍵，指定父類，聲明父類對象，然後刪除臨時變數，您是否覺得有些麻煩呢？至少我是這麼覺得的，一旦忘記了delete，還要承擔父類被修改的風險，針對這個，我們對這個用call和apply來改進！

   接著看代碼，還是上面的例子（為了更加容易大家理解，需求改變一下，Animal有了名字）：

   function Animal(name)

   {

           this.Run=function(){alert("I can Run");};

   }

   function People(name)

   {

           //使用call方法實現繼承

   this.father=Animal;

           this.father.call(this,name);

           this.name=name;

           this.SayName=function(){alert("My name is "+this.name;);};

   }

   function Girl(name,age)

   {

           //使用apply方法來實現繼承

           this.father=People;

           this.father.apply(this,new Array(name));

           this.age=age;

           this.Introduce=function(){alert("My name is "+this.name+".I am "+this.age);};

   }

   用一樣的測試代碼，發現測試一樣成功。

   如果是新手，可能看後面的這兩段代碼有些暈暈乎乎，什麼是call,什麼是apply呢？好，在玩轉繼承這個專題中，我加入一個增刊系列，如果對這個有不瞭解，可以看我的這個文章：《玩轉方法:call和apply 》。

對象偽裝，這隻是一種實現繼承的方式，在接下來的文章，我會繼續寫出其他的繼承方式以及幾種繼承方式的優劣，歡迎繼續關注。