原型
每一个 js 对象都有一个proto属性,这个属性指向了原型,这个属性在现在来说已经不建议直接使用了,这是浏览器在早期为了让我们访问到内部属性[[prototype]]来实现的一个东西.
讲到这里好像还是没明白什么是原型,接下来我们根据图来看看proto都有些啥:
原型也是一个对象,并且这个对象中包含了很多函数,所有我们可以得出一个结论:对于obj来说,可以通过__proto__找到了一个原型对象,且原型对象中定义了很多函数让我们来使用.
另外,从图片上我还发现了一个constructor属性,也就是构造函数.
结论:obj.__proto__.constructor === Object.
原型的 constructor 属性指向了构造函数
obj.__proto__.constructor属性,发现其中还有一个prototype属性,并且这个属性对应的值和先前在obj.__proto__中看到的一样.
得出结论:
- 对象的
__proto__属性指向了原型; 原型的constructor属性又指向了构造函数;构造函数又通过它的prototype属性指回了原型;
::: warning
并不是所有函数都具有constructor属性,如:Function.prototype.bind()
:::
原型链
接下来我们根据下面这张图来看看原型和原型链等关系,彻底搞明白它.
看完这张图,接下来我们就来解释下什么是原型链吧.
其实,原型链就是多个对象通过__proto__属性的方式链接了起来.
为什么obj对象可以访问到valueOf函数,因为obj通过原型链找到了valueOf函数.
看图梳理下:
-
__proto__：是对象就会有这个属性(强调是对象);函数也是对象,那么函数也有这个属性咯,它指向构造函数的原型对象； -
prototype：是函数都会有这个属性(强调是函数)，普通对象是没有这个属性的（JS 里面，一切皆为对象，所以这里的普通对象不包括函数对象）.它是构造函数的原型对象； -
constructor：这是原型对象上的一个指向构造函数的属性。
总结:
- 每一个对象都有
__proto__属性,__proto__==>Object.prototype(Object 构造函数的原型对象); - 每个函数都
__proto__和prototype属性; - 每个
原型对象都有constructor和__proto__属性,其中constructor指回'构造函数', 而__proto__指向Object.prototype; object是有对象的祖先,所有对象都可以通过__proto__属性找到它;Function是所有函数的祖先,所有函数都可以通过__proto__属性找到它;- 每个函数都有一个
prototype,由于prototype是一个对象,指向了构造函数的原型对象 - 对象的
__proto__属性指向原型,__proto__将对象和原型链接起来组成了原型链
