JavaScript原型链

通过浏览器控制台打印输出结果如下图所示：

想想为何会是这样的结果。首先，Fido显然只是小狗，而不是表演犬。事实 上，这完全符合我们的预期，毕竟Fido是使用构造函数Dog创建的，而这个构造函数与表演犬一点关系都没有。

接下来，Scotty既是小狗又是表演犬。这也合情合理，不过怎么会出现这样的结果呢?这是因为instanceof不仅考虑当前对象的类型，还考虑它继承的所有对象。Scotty虽然是作为表演犬创建的，但表演犬继承了小狗，因此Scotty也是小狗。

再接下来，Fido的构造函数为Dog。这合情合理，因为它就是使用这个构造函数创建的。

最后，Scotty的构造函数也是Dog。这不合理，因为它是使用构造函数ShowDog创建的。到底是怎么回事呢?先来看看这是如何得到的:查看属性scotty.constructor。由于我们没有显式地为表演犬设置这个属性，它将从小狗原型那里继承该属性。

为何会这样呢?坦率地说，这是一个需要修复的漏洞。正如你看到的，如果我们不显式地设置表演犬原型的属性constructor，就没人会这样做。不过，即便我们不这样做，一切也都将正常运行，但访问scotty.constructor时，
结果将不是预期的ShowDog，让人感到迷惑。

不用担心，下面就来修复这个问题。

首先，正如你看到的，没有正确地设置表演犬实例的属性constructor: 它们从小狗原型那里继承了这个属性。需要澄清的一点是，虽然代码都没问题，但给对象设置正确的构造函数是一种最佳实践，以免有一天另一 位开发人员接手这些代码并查看表演犬对象的情况时感到迷惑。

为修复属性constructor不正确的问题，需要在表演犬原型中正确地设置它。这样，创建表演犬实例时，它将继承正确的constructor属性，如下所示:

再次运行前面的测试，并核实表演犬实例Scotty的构造函数正确无误。

还有一个地方可以清理:构造函数ShowDog的代码。再来看一眼这个构造函数:

就这里而言，既然构造函数Dog已经知道如何完成这些工作，为何不让它去做呢?另外，虽然这个示例的代码很简单，但有些构造函数可能使用复杂的代码来计算属性的初始值。因此创建继承另一个原型的构造函数时，都不应重复既有的代码。下面来修复这个问题——先重写代码，再详细介绍它们:

正如你看到的，在构造函数ShowDog中，我们调用了方法Dog.call， 以此替换了那些重复的代码。这里的原理如下:call是一个内置方法，可对任何函数调用它(别忘了，Dog是一个函数)。Dog.call调用函 数Dog，将一个用作this的对象以及函数Dog的所有实参传递给它。下 面来详细介绍这行代码:

Dog.call详解

最终代码如下：

function Dog(name, breed, weight) {
    this.name = name;
    this.breed = breed;
    this.weight = weight;
}

Dog.prototype.species = "Canine";

Dog.prototype.bark = function () {
    if (this.weight > 25) {
        console.log(this.name + " says Woof!");
    } else {
        console.log(this.name + " says Yip!");
    }
};

Dog.prototype.run = function () {
    console.log("Run!");
};

Dog.prototype.wag = function () {
    console.log("Wag!");
};

function ShowDog(name, breed, weight, handler) {
    Dog.call(this, name, breed, weight);
    this.handler = handler;
}

ShowDog.prototype = new Dog();
ShowDog.prototype.constructor = ShowDog;
ShowDog.prototype.league = "Webville";
ShowDog.prototype.stack = function () {
    console.log("Stack");
};
ShowDog.prototype.bait = function () {
    console.log("Bait");
};
ShowDog.prototype.gait = function (kind) {
    console.log(kind + "ing");
};
ShowDog.prototype.groom = function () {
    console.log("Groom");
};


var fido = new Dog("Fido", "Mixed", 38);
var fluffy = new Dog("Fluffy", "Poodle", 30);
var spot = new Dog("Spot", "Chihuahua", 10);
var scotty = new ShowDog("Scotty", "Scottish Terrier", 15, "Cookie");
var beatrice = new ShowDog("Beatrice", "Pomeranian", 5, "Hamilton");

fido.bark();
fluffy.bark();
spot.bark();

scotty.bark();
beatrice.bark();
scotty.gait("Walk");
beatrice.groom();