原型与原型链

原型

每一个javascript对象(null除外)在创建的时候会关联另一个对象，这个对象就是原型，每一个对象都会可以访问到原型的属性和函数。

proto

每一个javascript对象(null除外)都具有的一个属性，叫__proto__，这个属性会指向对象的原型

prototype

每个函数都有一个prototype的属性（对象无此属性），这个属性指向一个原型对象。

构造函数

构造函数本质上就是一个函数，与普通函数有以下两点区别:

1. 一般情况下都会将构造函数首字母大写。如 Person
2. 使用new可以生成一个实例对象，一个构造函数可以生成多个实例对象。 如 let p = new Person()

彩蛋: 由以上两点可以发现，es6的箭头函数不能作为构造函数，因为没有函数名称。

原型与构造函数

每个原型都有一个constructor属性，这个属性指向关联的构造函数。 当获取实例对象的constructor时，实例对象中并没有这个属性，但是实例对象的原型中有这个属性，所以可以读取。

function Person(){
    
}
let p = new Person()

console.log(p.constructor=== Person) // true

console.log(p.constructor === Person.prototype.constructor)

原型与实例

当读取实例对象的属性时，如果找不到，就会查找与对象关联的原型中的属性，如果还找不到，就去找原型的原型中的属性，一直到顶层即Object.prototype为止。

function Person() {
}

Person.prototype.name = 'Kevin';

var person = new Person();

person.name = 'Daisy';
console.log(person.name) // Daisy

delete person.name;
console.log(person.name) // Kevin

关系图

最后来手动画一张关系图

参考

• JavaScript深入之从原型到原型链
• 【进阶5-1期】重新认识构造函数、原型和原型链
• JavaScript高级程序设计（第3版）