JavaScript的原型对象prototype、原型属性__proto__、原型链和constructor

时间:2023-03-09 01:51:12
JavaScript的原型对象prototype、原型属性__proto__、原型链和constructor

先画上一个关系图:

JavaScript的原型对象prototype、原型属性__proto__、原型链和constructor

1. 什么是prototype、__proto__、constructor?

var arr = new Array;

1. __proto__是原型属性,对象特有的属性,是对象指向另外一个对象(就是第二点的原型对象),一般是实例对象的属性,如arr.__proto__

2. prototype是原型对象,构造函数特有的属性,是构造函数指向的对象,如Array.prototype

  其中:

arr.__proto__ === Array.prototype; //true

3. constructor是原型对象用于指回构造函数的属性,是对象指向函数的,如Array.prototype.constructor

2. 他们的作用?

1. 原型属性__proto__的作用是为了实例对象能够使用构造函数继承下来的属性和方法。通俗点说就是

  当前对象找不到的属性会去通过__proto__去构造函数的原型对象找,直到找到null。这就是原型链!

2. 原型对象prototype是构造函数特有的属性(原型对象也是对象!),是为了让构造函数所实例化的对象们可以找到公用的属性和方法。

  可以想象prototype是用来存放:爸爸(构造函数)给儿子们(实例对象们)留下的家产,

  儿子们都可以通过__proto__(想象成钥匙)访问到prototype(存放家产的箱子),从而使用从爸爸那继承的属性和方法

3. constructor就像是原型对象prototype的身份证,可以找到构造函数,这是prototype特有的。

3. 他们之间一些复杂的关系:

1.  arr.constructor === Array;

  实例对象arr本身并没有constructor属性,这是原型对象特有的属性嘛

  但是arr可以访问到他爸爸(构造函数)的原型对象呀!通过__proto__就可以访问到了Array.prototype了呀

  所以 arr.constructor 实际上是 arr.__proto__.constructor

2. 刚刚说了__proto__是对象指向另外一个原型对象,而函数实际上就是对象,所以构造函数也会有__proto__(这个在图上没有写)

Array.__proto__ === Function.prototype; //true
console.log(Array.__proto__);//ƒ () { [native code] }

 注意:函数的__proto__一律都指向Function.prototype,即构造函数都默认为Function的儿子,而Function的__proto__也是指向自己的prototype

Function.__proto__ === Function.prototype;// true

参考文章:https://blog.****.net/cc18868876837/article/details/81211729