一篇文章搞定JS原型链

学习JS的过程中，对原型对象和原型链是其中的重点和难点，花费了不少的时间才整明白这个知识点，如果下文有任何的错误和不足请指正！

原型链是JS实现继承的一种方式，每个构造函数都有一个原型对象prototype属性，这个属性是一个指针，指向一个构造函数，而每个实例对象都有一个私有的属性(proto)指向它的构造函数的原型对象，这个原型对象也有一个自己的私有属性__proto__也是指向一个对象的原型对象，直到为null。

function fun1() {
    this.a = 1;
    this.b = 2;
}
 console.log(fun1.prototype);

结果如下：

接下来我们给fun1函数的原型对象添加新的属性

fun1.prototype.c = 3;
fun1.prototype.d = 4;
console.log(fun1.prototype);

看到的结果是这样的：

现在我们实例化一个对象，并且添加一些属性

var obj = new fun1();
console.log(obj) //{a: 1, b: 2}
obj.value = "我是实例化后新增的属性";
console.log(obj);

结果如下：

现在就相对明显了，obj中的__proto__是fun1.prototype，这也就说明了一个实例对象都有一个__proto__属性指向构造这个对象的构造函数的原型对象。

思考：c 是 obj 自身的属性吗？

不是，当你访问obj中的一个属性时，会先查看obj自身是否存在这个属性，如果不存在，就会在obj的__proto__中进行查找，如果还是不存在，就会通过obj的__proto__的__proto__去查找，在更多的__proto__整个原型链查找一遍，没有更多的__proto__后并不存在这个属性，所以输出是undefined

继承

下面用一个简单的例子说明原型链继承

function Person(name, age) {
    this.name = name;
    this.age = age;
}
Person.prototype.say = function() {
    console.log(`我叫${this.name}, 今年${this.age}岁`);
}
function Student() {}
//继承
Student.prototype = new Person("张三", 18);
var stu = new Student();
stu.say();		//我叫张三, 今年18岁

再看下面这个例子，将Student的原型指向Animal实例对象

function Animal(name) {
    this.name = name;
}
Animal.prototype.fly = function() {
    console.log(`我是一只${this.name}, 我会飞`);
}
Student.prototype = new Animal("小鸟");
var stu2 = new Student();
stu2.say();		

结果如下：

总结

一个实例对象都有一个__proto__属性指向构造这个对象的构造函数的原型对象

构造函数的原型对象(prototype)指向如果发生了改变，那么实例对象的原型(proto)指向也会发生改变

实例对象和原型对象之间的关系是通过__proto__ 原型来联系起来的，这个关系就叫做原型链