I was looking for good example of Javascript prototypical inheritance on SO and this question, Benefits of using 'Object.create' for inheritance, has an excellent answer and so I tried to push my luck by adding another object type to the prototype chain and I found something that looks strange.
The original listing has Dog
inheriting from Animal
and we can see Animal
in the prototype chain. However, if we add Creature
and have Animal
inheriting from that then Animal
disappears from the reported prototype chain if we use console.info.
Can anyone explain why the prototype chain shouldn't say Dog
->Animal
->Creature
?
Here is code listing
"use strict";
//https://www.typescriptlang.org/docs/handbook/classes.html
var Creature = (function () {
function Creature() {
return this;
}
Creature.prototype.deadOrAlive = function () {
console.log("alive"); //hard code for now
}
return Creature;
}());
var Animal = (function () {
Animal.prototype = Object.create(Creature.prototype);
function Animal() {
return this;
}
Animal.prototype.move = function (distanceInMeters) {
if (distanceInMeters === void 0) {
distanceInMeters = 0;
}
console.log("Animal moved " + distanceInMeters + "m.");
};
return Animal;
}());
var Dog = (function () {
/* https://stackoverflow.com/questions/17392857/benefits-of-using-object-create-for-inheritance/17393153#answer-17393153 */
Dog.prototype = Object.create(Animal.prototype);
function Dog() {
return this;
}
Dog.prototype.bark = function () {
console.log("Woof! Woof!");
};
return Dog;
}());
var dog = new Dog();
dog.bark();
dog.move(10);
dog.bark();
dog.deadOrAlive();
//debugger;
A colleague at a Javascript boot camp of which I am member has come up with a one-line solution, just use
Object.setPrototypeOf( Animal.prototype, Creature.prototype )
. Thanks, Ray!