[JS]原型链的解释和梳理

111 阅读2分钟

本文已参与「新人创作礼」活动,一起开启掘金创作之路。 在这里插入图片描述

  • 链关系:
    • 自身 => 原型 => Object
  • 当我们使用一个属性或方法时,会先在自身查找
    • 自身如果有,则直接使用
    • 自身没有则去原型查找,原型上有则使用
    • 原型上没有,则去原型(Object)查找,有则使用,无则返回undefined

举个栗子

在这里插入图片描述

原型

  • 所有引用类型都有一个__proto__(隐式原型)属性,属性值是一个普通的对象
  • 所有函数都有一个prototype(原型)属性,属性值是一个普通的对象
  • 所有引用类型的__proto__属性指向构造函数的prototype

原型链

当访问一个对象的某个属性时,会先在这个对象本身属性上查找,如果没有找到,则会去它的__proto__隐式原型上查找,即它的构造函数的prototype,如果还没有找到就会再在构造函数的prototype的__proto__中查找,这样一层一层向上查找就会形成一个链式结构,我们称为原型链

举个栗子

function Parent(month){
    this.month = month;
}
var child = new Parent('Ann');
console.log(child.month); // Ann
console.log(child.father); // undefined

image.png

访问的路径

image.png

  • 一直往上层查找,直到到null还没有找到,则返回undefined
  • Object.prototype.proto === null
  • 所有从原型或更高级原型中的得到、执行的方法,其中的this指向当前这个触发事件执行的对象

总结

一个对象有原型对象,它的原型对象也有自己的原型对象,一直往上找,找到Object对象,Object对象的的原型对象是null,在往上就没了。这个像链式一样的结构称为原型链。其本质描述的是对象的一种继承关系。就是说一个对象是怎么来的,是继承自它的原型对象。所以说绝大多数对象,其实都是继承自Object这个构造函数的原型对象,为什么是大多数,因为我们可以通过修改构造函数的原型来破坏这种继承关系