JavaScript物件導向繼承方法

　JavaScript的出現已經將近20多年了，但是對這個預言的褒貶還是眾說紛紜。很多人都說JavaScript不能算是物件導向的變成語言。但是JavaScript的類型非常鬆散，也沒有編譯器。這樣一來給了程式員很大的自由，也帶來了一些缺陷。

　　雖然JavaScript不算是一門物件導向的語言。但是我們可以模仿著其他語言實現物件導向的方式來實現JavaScript的面向編程。

　　下面是JavaScript教程中非常經典的繼承方法。

 

//定義一個Pet對象。通過這一個名稱和數量的腿。  var Pet = function  (name,legs) {     this.name = name; //Save ths name and legs values.      this.legs = legs; };  //建立一個方法,顯示了Pet的名字和數量的腿。  Pet.prototype.getDetails = function  () {     return this.name + " has " + this.legs + " legs "; }  //定義一個Cat對象,繼承從Pet。  var Cat = function  (name) {     Pet.call(this,name,4); //調用這個父物件的建構函式  };  //這條線執行繼承從Pet。  Cat.prototype = new Pet();  //增加一個動作方法的貓  Cat.prototype.action = function  () {     return "Catch a bird"; };  //建立一個執行個體petCat的貓。  var petCat = new Cat("felix");  var details = petCat.getDetails();  console.log(details)                //"felix has 4 legs".   var action = petCat.action();       console.log(action)             //"Catch a bird".  petCat.name = "sylvester";              //改變petCat的名字  petCat.legs = 7;                //改變petCat腿的數量  details = petCat.getDetails();      console.log(details)                //"sylvester has 7 legs". //定義一個Pet對象。通過這一個名稱和數量的腿。var Pet = function  (name,legs) { this.name = name; //Save ths name and legs values. this.legs = legs;};//建立一個方法,顯示了Pet的名字和數量的腿。Pet.prototype.getDetails = function  () { return this.name + " has " + this.legs + " legs ";}//定義一個Cat對象,繼承從Pet。var Cat = function  (name) { Pet.call(this,name,4); //調用這個父物件的建構函式};//這條線執行繼承從Pet。Cat.prototype = new Pet();//增加一個動作方法的貓Cat.prototype.action = function  () { return "Catch a bird";};//建立一個執行個體petCat的貓。var petCat = new Cat("felix");var details = petCat.getDetails();console.log(details)    //"felix has 4 legs".var action = petCat.action();   console.log(action)    //"Catch a bird".petCat.name = "sylvester";          //改變petCat的名字petCat.legs = 7;    //改變petCat腿的數量details = petCat.getDetails();   console.log(details)    //"sylvester has 7 legs".

　　上述方法雖然執行起來沒有太大的問題，但是代碼整體風格略顯臃腫，並不很優雅。在外面還是可以對屬性進行修改。這種方法沒有對繼承的屬性進行保護。下面一種方法，省去的new和prototype，利用“函數繼承”的特性實現。

 

//定義一個pet對象。通過這一個名稱和數量的腿。  var pet = function (name,legs) {     //建立一個對象that，其中名字是可以改的，但是腿數不可以改，實現了變數私人化。      var that = {             name : name,             getDetails : function  () {                 return that.name + " has " + legs + " legs ";             }         };      return that; }  //定義一個cat對象,繼承從pet。  var cat = function  (name) {     var that = pet(name,4); //從pet中繼承屬性       //cat中增加一個action的方法。      that.action = function  () {         return "Catch a bird";     }      return that;  }  //建立一個petCat2;  var petCat2 = cat("Felix");  var details = petCat2.getDetails();  console.log(details)                //"felix has 4 legs".  var action = petCat2.action();       console.log(action)             //"Catch a bird".  petCat2.name = "sylvester";             //我們可以改變名字。  petCat2.legs = 7;               //但是不可以改變腿的數量  details = petCat2.getDetails();     console.log(details)                //"sylvester has 4 legs". //定義一個pet對象。通過這一個名稱和數量的腿。var pet = function (name,legs) { //建立一個對象that，其中名字是可以改的，但是腿數不可以改，實現了變數私人化。 var that = {   name : name,   getDetails : function  () {    return that.name + " has " + legs + " legs ";   }  }; return that;}//定義一個cat對象,繼承從pet。var cat = function  (name) { var that = pet(name,4); //從pet中繼承屬性 //cat中增加一個action的方法。 that.action = function  () {  return "Catch a bird"; } return that;}//建立一個petCat2;var petCat2 = cat("Felix");var details = petCat2.getDetails();console.log(details)    //"felix has 4 legs".var action = petCat2.action();  console.log(action)    //"Catch a bird".petCat2.name = "sylvester";          //我們可以改變名字。petCat2.legs = 7;    //但是不可以改變腿的數量details = petCat2.getDetails();   console.log(details)    //"sylvester has 4 legs".

        溫馨提示：使用原型繼承的好處是記憶體效率高，不管它被繼承多少次，對象的原型屬性和方法只被儲存一次。函數繼承的時候，每個新的執行個體都會建立重複的屬性和方法。若建立很多大的對象，記憶體消耗會很大。解決方案是把較大的屬性或方法儲存在一個對象中，並將其作為參數傳給建構函式。這樣所有執行個體就會使用一個對象資源，而不是建立自己的版本了。

　　上面兩種方法都可以輕鬆實現JavaScript物件導向的繼承，沒有哪種方法絕對的好，也沒有哪種方法絕對的不好。依個人情況喜好而定。這兩種方法也不是唯一的，歡迎大家評論補充喲!~