Esempio di prototipo ed ereditarietà JavaScript per animali

Question

Sto cercando di cogliere OOP con JavaScript con esempi molto semplici.

Il mio obiettivo è creare una gerarchia di classi con Animali come esempio.

In una gerarchia animale semplificato potremmo vedere qualcosa di simile:

  Animal 
      /\ 
    Mammal  Reptile 
     /\   /\ 
    Human Dog Snake Alligator 

voglio prendere questo esempio e creare classi all'interno di JavaScript. Ecco il mio tentativo. Cosa posso fare per migliorarlo?

function Animal(name) { 
    this.name = name; 
    } 

function Mammal() { 
    this.hasHair = true; 
    this.numEyes = 2; 
    this.blood = "warm"; 
} 

function Dog(breed) { 
    this.breed = breed; 
    this.numLegs = 4; 
} 

Dog.prototype = new Animal("Fido"); 
Dog.prototype = new Mammal(); 

var Fido = new Dog("Lab"); 

console.log(Fido.name); // returns undefined when i want it to return Fido 
console.log(Fido.hasHair); // returns true as expected 
console.log(Fido.breed); // returns lab as expected 

Quello che vorrei fare è di avere cane estendere le proprietà di mammiferi e degli animali dal momento che è al tempo stesso, ma non funziona correttamente. Sto assumendo perché sto chiamando dog.prototype = new Mammal() dopo new Animal() che sta sovrascrivendo la connessione.

Come scrivere correttamente queste classi in modo da poter richiamare tutte le proprietà delle loro classi padre?

Grazie.

Answer 1

Si desidera utilizzare Prototypical Inheritance, che in Javascript è un po 'strano ma potente.

function Animal(name) { 
    this.name = name; 
} 

// Example method on the Animal object 
Animal.prototype.getName = function() { 
    return this.name; 
} 

function Mammal(name, hasHair) { 
    // Use the parent constructor and set the correct `this` 
    Animal.call(this, name); 

    this.hasHair = hasHair; 
} 

// Inherit the Animal prototype 
Mammal.prototype = Object.create(Animal.prototype); 

// Set the Mammal constructor to 'Mammal' 
Mammal.prototype.constructor = Mammal; 

Mammal.prototype.getHasHair = function() { 
    return this.hasHair; 
} 

function Dog(name, breed) { 
    // Use the parent constructor and set the correct `this` 
    // Assume the dog has hair 
    Mammal.call(this, name, true); 

    this.breed = breed; 
} 

// Inherit the Mammal prototype 
Dog.prototype = Object.create(Mammal.prototype); 

// Set the Dog constructor to 'Dog' 
Dog.prototype.constructor = Dog; 

Dog.prototype.getBreed = function() { 
    return this.breed; 
} 

var fido = new Dog('Fido', 'Lab'); 

fido.getName(); // 'Fido' 
fido.getHasHair(); // true 
fido.getBreed(); // 'Lab' 

una buona risorsa per OOP in Javascript possono essere trovati sul Mozilla Developer Network