从对象创建来理解原型链

一、理解__proto__ 和prototype

在理解原型链之前我们先来看两个属性，__proto__ 和prototype，在我的理解中，__proto__和prototype是对象和函数与其继承对象的一种关系标识

• __proto__：对象的一个属性，指向它的原型
• prototype：函数的一个属性，指向它的原型对象

二、对象创建总结

方式一：对象字面量

• 特点：创建一个自定义属性的对象，属性在创建的时候定义,不能复用

let obj = {
  name: 'a',
  age: 'b'
}

• 观察obj的__proto__属性：obj有__proto__属性，指向Object对象

备注：Object构造函数同样具体prototype属性，其指向Object.prototype，Object.prototype具有__proto__属性指向null

• 原型链简单的图示

 

 

 

方式二：new Object()

• 特点：通过object对象创建的对象同字面量一样属性均需要每次都定义一次

let obj = new Object()

• 观察obj的__proto__属性：obj有__proto__属性，指向Object对象 

• 原型链的简单图示和上面一样

方式三：通过构造函数创建

• 特点：创建可复用，属性可动态传入

function Person(name) {
  this.name = name
}
let person1 = new Person('a')
let person2 = new Person('b')
let person3 = new Person('c')

• 观察person1，person2，person3的__proto__属性，均指向Person函数 

• 再继续观察Person函数,Person具有prototype属性，指向Person.prototype，Person.prototype具有__proto__属性，指向Object()

• 原型链的图解

 

方式四：工厂模式

• 特点：不使用构造函数的方式同样可以动态传入参数创建对象

function createPerson(name) {
    let o = new Object()
    o.name = name
    return o
}
let p = createPerson(name)

•  观察p的指向，对象p具有__proto__指向Object,从这里我们可以看到工厂模式和构造函数模式的区别，p的__proro__指向的是Object对象而不是函数createPerson

• 原型链简单的图示（函数createPerson不是构造函数，所以不会在p的原型链上出现）

 三、总结

从上面的例子中我们可以看出原型链的关系图，当我们访问一个对象的属性时，会现在自己的属性列表中查找，找不到则向原型链上去找，同样是找到就返回