图解原型链

原型链作为js中最难的一部分，特此将自己的理解记录下来，以免遗忘。

一句话说，原型链就是实现继承的一种方式。换一种方式，原型链就是找原型对象。

1.先说说构造函数：

function Pig(){
    this.name = "猪"；       
}  
var pig = new Pig()
//Pig()就是构造函数，pig为实例对象。

　　构造函数是一种特殊的函数，学过java的同学应该知道，他就是在创建对象时初始化对象的，也就是给new出来的实例对象进行赋值的，当然那些值都是new的时候传进来的。

2.原型对象（原型链就是找原型对象）

　　js中，当一个函数A被申明时，会在内存中创建一个对象B，这个B就是A的原型对象。B对象会创建一个constructor属性指向A，A对象自动创建一个prototype属性指向B。这两个属性默认隐藏的。

　　注意，当我们使用new来创建一个实例对象（p1）的时候，这个对象实际上创建完就和构造函数(person())没有联系了，而只是和原型对象有联系。

　　通俗的说，就相当于连线一样，构造函数只是在创建连线的时候起到了一个中间部分的作用，当这条线连好了，就把构造函数从线上丢弃了。（过河拆桥啊）

　　这里的图有点问题，p1中的属性实际上是__proto__，这个属性是在创建实例的时候自动创建的，指向原型对象。其实，prototype和__proto__都是用来指向原型对象的，只不过一个用于函数，一个用于对象。

3.原型链

　　原型链，实际上就是去找它的原型对象，如果某个属性在上一个原型对象没有找到，则依次网上找原型对象。

　　原型对象也是对象，所以它也有__proto__，指向上一层的原型对象，比如Object等。

4.instanceof　　

//定义构造函数
function C(){
}
function D(){
}
var c = new C();
c instanceof C;  //true
//c instanceof C 相当于判断 c.__proto__=== C.protype
也就是，c的原型对象是不是C的原型对象 

 注意，由于构造函数C()的上一层为Object()，所以，c instanceof Object也是对的。因为他们都在原型链上。

（所以，为了解决这个问题，一般都是用 c.__proto__.constructor === C.）

5.执行new运算符过程中发生了什么（深入）

var c = newC();　　

第一步：创建一个新的对象，继承自构造函数指向的原型函数

第二步：执行构造函数，将上下文指定给这个新的对象（this）

第三步：判断构造函数是否返回一个对象，如果不是，则返回第一步的对象，如果不是，那么前面的都没用了，直接返回构造函数返回的对象。

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有