1.前言Prototype和原型链一直在面试中被高度重视,经常被提及。说难可能不算太难,但要真正充分理解和领会,还是需要努力的。下面简单说明一下我对原型和原型链的理解。如果您觉得有什么不对的地方,请指正,或者关闭页面以免浪费您宝贵的时间(怕)II.字面量原型JavaScript中的所有对象本质上都是通过new函数创建的,包括以对象字面量形式定义对象(相当于newObject()的语法糖)。所有函数本质上都是通过newFunction创建的,包括Object、Array等(隐式执行,我们看不到但在执行过程中发生了)。所有函数都是对象。Prototype(显式原型)分析每个函数都有一个属性prototype,也就是原型。默认情况下,它是一个普通的Object对象,是调用构造函数创建的实例的原型。__proto__(谷歌浏览器已经更新为[[prototype]],隐式原型)JavaScript中的所有对象(null除外)都有一个__proto__属性,它指向对象的原型。上图中,函数上的属性会被显式继承,即//this.name='wn',此时不显式存在,所以不能被继承,但是原型上有属性的函数,所以它会被隐式继承,即name:"小南"constructor属性参考前端高级面试题详解JavaScript还有一个属性从原型指向构造函数:constructor,即Func.prototype.constructor-->Funcprototypechaininstance当一个对象在查找某个属性时,如果找不到,就会按照__proto__在该对象关联的原型上进行查找。如果还是找不到,就会去寻找原型的原型,直到找到最顶层,这就是原型链的概念。从这张图中我们可以注意到构造函数Foo的原型prototype与构造函数Foo创建的对象实例f1和f2的原型__proto__相同,都指向Foo().prototype。这里我们可以继续思考,进一步探索,既然Foo().prototype也是一个对象,那么Foo().prototype是不是也有自己的对象原型__proto__呢?答案是肯定的,我们还可以看到图中的Foo().prototype对象原型__proto__指向的是Object.prototype。Object是最顶层的构造函数,可以看到所有的对象都会通过原型链指向它。这也是为什么新的对象可以使用toString()等方法的原因。但是我们可以发现Object.prototype也有自己的__proto__但是它指向的是null,也就是原型链的末端。注意!!!那么这里还有一个问题。细心的朋友发现了构造函数有自己的Prototype原型,但是构造函数也是一个对象。构造函数有__proto__吗?答案是肯定的。因为每个JavaScript函数实际上都是一个Function对象。运行function(){}).constructor===Function//true得到这个结论。而且通过图中我们还可以发现,Foo的__proto__指向的是Function.prototype,这里有一个特例。上面也说明每一个JavaScript函数其实都是一个Function对象,所以Function的构造函数原型prototype和对象Prototype__proto__都指向同一个Function.prototype。结语Prototype和原型链是js中的一座大山。它们比较概念化,经常出现在面试中,所以你可以在空闲时间用它们来思考它们。写的也有点肤浅,希望能对正在看的小伙伴有所帮助。码字不易,希望在座的小伙伴们用自己的小手发大财,点个赞,鼓励一下!
