以小白的视角浅谈一下原型与原型链
前言
近段时间,由于在身边以及网络上,接触到太多关于求职方面的信息,这让本身就已经到达大三的我感到十分的焦虑与不安,深知自身能力不足的我在经历一段时间的迷茫,决定还是静下心来稳扎稳打,夯实基础。因此决定写下这篇文章,检验自己对原型与原型链的理解。有不对的地方希望各位大佬指点。
什么是原型(prototype)
原型就是具有公共属性和方法的对象。 原型就是提供了一个公共的区域,在这个区域里面声明的属性和方法,可以在任何通过这个类所创造的对象中被访问
原型是一个对象,在其中有两个属性
- 构造器constructor:指向这个类(函数)本身
- 原型指向__proto__:该属性指向原型本身,提供给通过类创建的对象使用。
原型分为隐式原型和显示原型
每个函数都有一个prototype属性,每个对象都有一个__proto__属性。
两个原型之间的关系是什么呢
一般构造函数的prototype和实例的的__proto__指向的是同一个地方,原型对象
function person() {}
let son = new person()
console.log(son.__proto__ === person.prototype); // true
构造函数person,也是一个普通的函数,只是使用了new。因此构造函数,也可以使用new Function()来进行创建, 而这时Function也作为一个构造函数,Function也有自己的原型对象。而person函数为Function的实例对象
let person = new Function()
console.log(person.__proto__ == Function.prototype); // true
函数 是 构造函数 Function的实例
经历上面我们可以的到
对象的原型
从文章开头我们可以知道,显示原型其实是一个对象,而对象具备一个隐式原型__proto__。 因此我们会想,这些对象的原型指向哪里呢?
首先,我们得知道在日常使用中,我创建对象的方法一般有:
- 构造函数
- 使用new Object
- 字面量创建
- object.create()
其中构造函数创建,在上文中我们已经有过讨论了,因此我们讨论一下剩下的三种方法。
字面量创建对象,其本质就是使用new Object创建对象,只是写法不同。
在上文已经提到过,一般构造函数的prototype和实例的的__proto__指向的是同一个地方,原型对象
那 Object的实例对象与Object()应该也符合这个规则,我们可以用代码检验一下:
let pobj1 = {}
let pobj2 = new Object()
console.log(pobj1.__proto__ == Object.prototype); // true
console.log(pobj2.__proto__ == Object.prototype); // true
console.log(Object.__proto__ == Function.prototype); // true
因此我们发现,对象也是符合这个规则的。我们可以丰富我们的导图。
回到上面说的,显示原型也是一个对象,因此显示原型也有他的隐式原型,为其构造函数的显示原型。
构造器constructor
文章开头说了,原型有两个属性,剩下的构造器constructor属性,指向的是什么呢?
其实构造器constructor指向的就是构造函数本身,也就是说
原型链
讲完了原型之后,我们就可以来聊聊原型链是什么。
从名字不难理解,原型链,就是以原型组成的链。其中连接各个原型的是__proto__
原型链的终点就是null
原型链的使用
JavaScript就是依靠原型链来实现继承的,可以参考阮一峰老师的 Javascript继承机制的设计思想,这里我就不去多做接释(我也不是很懂)。
instanceof
instanceof主要的实现原理就是只要右边的prototype在左边的原型链上即可(注意,instanceof运算符只能用于对象,不适用原始类型的值)。
结语
以上就是本人作为一个前端小白,通过学习查阅资料得到的对原型与原型链的理解,如果有不对的地方还望指出,有对你有帮助的话也请点点赞。^_^