2016-05-28 10 views
0

Ich bin in der Suche nach Javascript Vererbung zum ersten Mal, und ich nicht in der Lage, es zur Arbeit zu bekommen, oder vielleicht verstehe ich es nicht richtig. So habe ich einige Code hier, lassen Sie uns einen Blick an ihm haben:wie JavaScript-Vererbung zu implementieren

<script language="javascript" type="text/javascript">    
      //object and prototype 
      function cat(name){//object constructor 
       this.name = name;//property 
       this.talk = function(){//method 
        console.log(this.name + " say meeow"); 
       } 
      }   
      cat1 = new cat("Cat 1 Felix") 
      cat1.talk();    
      cat2 = new cat("cat 2 Joy") 
      cat2.talk() 
      //inheritance 
      function isleManCat(name){ 
       cat.call(this,name) 
       this.feature = "no tail" 
       this.detail = function(){ 
        console.log(this.name + " has " + this.feature); 
       } 
      } 
      isleManCat.prototype = new cat(); 
      cat3 = new isleManCat("isle of Man cat") 
      cat3.talk(); 
      cat3.detail();   
     </script> 

So habe ich 2 Katzen hier Objekte und cat1 und cat2 druckt die erwarteten Ergebnisse:

Cat 1 Felix say meeow 
cat 2 Joy say meeow 

. Dann cat3 ist ein isleOfMan() Katze, die von Katze erben sollte(), und ich hätte gedacht, dass es den Namen Eigentum von Katze erben würde(), aber er druckt nicht definiert:

undefined say meeow 
undefined has no tail 

Kann mir jemand bitte lassen Sie wissen Warum funktioniert es nicht und was mache ich falsch? Ich verstehe das nicht. Dank

+1

Welchen Namen erwarten Sie die Katze: Sie können Rest Parameter verwenden haben? – Amit

+1

Sie haben zu Beginn nie einen Namen für Ihre 'isleManCat' angegeben. – RainingChain

+1

'isleManCat()' muss den Konstruktor aufrufen, von dem er geerbt wurde. Es gibt Tausende Tutorials zur Vererbung in Javascript und Hunderte von Antworten zum selben Thema. Bitte lesen Sie und stellen Sie eine viel spezifischere Frage, wenn Sie nicht weiterkommen. Wir sind kein allgemeiner Lerndienst, wenn Sie keine eigenen Recherchen durchgeführt haben. Starten Sie beispielsweise [hier] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain). – jfriend00

Antwort

1

Ihr drittes Kätzchen cat Ableitung nicht Ihr erwartetes Ergebnis liefern, da der cat Konstruktor wird nicht von isleManCat ‚s Konstruktor Auto-magisch genannt werden! Und dein drittes Kätzchen hat überhaupt keinen Namen!

 // You need to pass the name of the whole cat to this constructor 
     // to later give it as argument to base constructor (i.e. cat()) 
     function isleManCat(name){ 
      // This is calling cat constructor function setting the "this" 
      // keyword to the "this" of isleManCat 
      cat.call(this, name); 

      this.feature = "no tail" 
      this.detail = function(){ 
       console.log(this.name + " has " + this.feature); 
      } 
     } 

In ECMA-Script 5.x Sie auch Function.prototype.apply und arguments reservierte Schlüsselwort verwenden können isleOfMan Konstruktor Argumente als Array an cat weitergeben müssen:

 function isleManCat(){ 
      cat.apply(this, arguments); 

      this.feature = "no tail" 
      this.detail = function(){ 
       console.log(this.name + " has " + this.feature); 
      } 
     } 

Und in der ECMA-Script 2015 und oben

 function isleManCat(...args){ 
      // This is calling cat constructor function setting the "this" 
      // keyword to the "this" of isleManCat 
      cat.apply(this, args); 

      this.feature = "no tail" 
      this.detail = function(){ 
       console.log(this.name + " has " + this.feature); 
      } 
     } 
Verwandte Themen