原型链解读

本文思路：想了解原型链，必须知道什么是原型，那么原型又是怎么产生的，追本溯源的来理解原型链。

原型怎么来：

创建对象的三种方式：

1、字面量的方式——原始、简单，但是麻烦
2、调用系统的构造函数——挺好，但受限制
3、自定义构造函数——那就这种，又方便又自由

此时，我们来写个创造“人”的对象的构造函数，看代码：

    function Person(name,age) {
      this.name=name;
      this.age=age;
      this.makeTool=function () {
        console.log("制造工具");
      };
    }

    var p1 = new Person("Jack",18)
    var p2 = new Person("Mark",21)
    var p3 = new Person("Susan",18)

每当我们new一个person的时候，每个人都有名字、年龄，都会制造工具，但制造工具是相同的能力（方法）。
于是，我们给Person（）这个构造函数一个属性prototype:

    Person.prototype.makeTool = function(){
      console.log("制造工具")
    }

我们可以通过p1.makeTool()来调用这个方法，p1 p2 p3都可以公用这个方法，这样我们就节省了内存，共享了数据，这也是prototype的作用之一，prototype就是原型。

充分理解原型链

    //动物有名字,有体重,有吃东西的行为
    //狗有名字,有体重,有毛色, 有吃东西的行为,还有咬人的行为
    //金毛有名字,有体重,有毛色,性别, 有吃东西的行为,还有咬人的行为,保护主人的行为

    function Animal(name,weight) {
      this.name=name;
      this.weight=weight;
    }
    //动物的原型的方法
    Animal.prototype.eat=function () {
      console.log("天天吃东西,就是吃");
    };

    //狗的构造函数
    function Dog(color) {
      this.color=color;
    }
    Dog.prototype=new Animal("哮天犬","50kg");
    Dog.prototype.bitePerson=function () {
      console.log("哼~汪汪~咬死你");
    };

    //金毛
    function jinMao(sex) {
      this.sex=sex;
    }
    jinMao.prototype=new Dog("黑白色");
    jinMao.prototype.protectHost=function () {
      console.log("汪汪汪，保护主人");
    };
    var jinMao=new ErHa("雄性");
    console.log(jinMao.name,jinMao.weight,jinMao.color); //哮天犬 50kg 黑白色
    jinMao.eat();                  //天天吃东西,就是吃
    jinMao.bitePerson();      //哼~汪汪~咬死你
    jinMao.protectHost();     //汪汪汪，保护主人

以上代码画图表示原型链：

原型链.png

通过以上例子，再将原型链扩展：

原型链完整.png

每当代码读取某个对象的某个属性，都会执行一次搜索，目标是具有给定名字的属性，搜索首先从对象实例本身开始，如果在实例中找到了具有给定名字的属性或方法，则返回该属性的值；如果没有找到，则继续搜索指针指向的原型对象，在原型对象中查找具有给定名字的属性或方法。

以上，便是对原型链的解读。

--end