重温js——原型和原型链

119 阅读2分钟

这是我参与8月更文挑战的第12天,活动详情查看:8月更文挑战

我们在前文说到,所有的对象都是通过new 函数来创建的,所有的函数也都是对象 . 那么问题来了,Function也是一个函数,那么他是怎么来的呢?(这个问题是不是类似有点像先有鸡和先有蛋的感觉)但是Function函数是在js引擎启动的时候,就直接把Function放入到内存中的.

原型 prototype

所有函数都有一个属性: prototype,称之为原型 .

在这里插入图片描述

prototype在默认情况下是一个object对象.
默认情况下, prototype中有一个属性: constructor, constructor本身也是一个对象,他们之间的关系如下:

在这里插入图片描述

通过上图我们知道,函数的原型的构造函数 和 函数本身是一模一样的.在这里插入图片描述
原型有啥用呢?为啥原型的构造函数又要等函数呢?

隐士原型 __proto__

所有的对象都有一个属性: __proto__, 这个属性称之为隐士原型.
在这里插入图片描述

隐士原型默认情况下指向创建该对象的函数的原型.

在这里插入图片描述

用一幅图来总结一下:

在这里插入图片描述

对象访问属性的查找方式

对象在查找属性的时候,如果本身不存在的话,他会一层一层查找自己的隐士原型(proto),找到后返回.知道找到null后返回undefined
在这里插入图片描述

既然人家可以在原型上加方法,咋们也可以在原型中加方法,但是这样做会造成原型的污染.

原型链

原型链是啥子呢,我们先来解释链条,链条就是有有限个铁环相互连接在一起,形成一根有限长度的链条.原先链肯定就是有有限个__proto__连接起来的链条,我们称之为原型链.

在这里插入图片描述

如上图我们看到的 newA.__proto__.__proto__.__proto__ 这种在每个对象之间都通过 __proto__ 是不是有点像链条呢.

原型链路

在这里插入图片描述

  • Function__proto__Functionprototype是指向同一个地址的

在这里插入图片描述

  • 隐士原型的最终指向是null;
  • Object__proto__Function的原型执行同一个地址.

在这里插入图片描述