原型链的理解

原型对象和函数三角形

function Person（）{};
var p = new Person();
//如图，构造函数的.prototype属性的值就是原型对象
//实例对象是构造函数new出来的，该过程称为实例化
//原型对象的.constructor属性的值就是构造函数
//实力对象可以通过.__proto__属性访问到原型对象

什么是原型？

• 构造函数的prototype属性的值就是原型
• 将公共的方法或属性放到原型对象中，能够解决方法重复浪费内存的问题
• 给原型对象添加属性，实例对象可以直接使用
• 原型的作用主要是继承
• 原型的类型是Object

.proto属性 与 .prototype属性

• 主要区别：.proto是站在实例对象的角度访问原型对象；而.prototype是站在构造函数的角度访问原型对象；
• .proto是非标准属性,由浏览器提供，不能用于生产环境中，主要用于辅助我们理解对象之间的关系

.constructor属性

• 每个原型对象都有一个对应的constructor属性
• constructor描述的是创建原型对象的构造函数
• 所以 p.constructor === Person 的结果为true

什么是原型链？

对象有原型对象，原型对象也是对象，所以原型对象也有原型对象，这样一环扣一环就形成了一条链式结构，叫做：原型链

完整的原型链结构图

function  Fn () {};
var f = new Fn();
//1.将函数看做构造函数
//构造函数：Fn
//实例对象：f
//原型对象：Fn.Prototype

function Fn () {};
//2.将函数看做实例对象（函数可以这样创建：var Fn = new Function () {}）
构造函数：Function
实例对象：Fn
原型对象：Function.prototype

var obj = new Object();
//3.将Object看做构造函数
构造函数：Object
实例对象：obj
原型对象：Object.prototype

//4.将Object看做实例对象
构造函数：Function
实例对象：Object
原型对象：Function.Object

//5.将Function看做实例对象
通过.__proto__访问到原型对象
//注意：Function作为对象时，是Function作为构造函数时的实例对象，继承自Function.prototype;
//即：Function.prototype === Function.__proto__

image.png