javascript 7种继承-- JavaScript 中的 [[Prototype]] 与 __proto__ 与 .prototype 为什么 JavaScript 中有这么多类型的原型?

前言

为什么 JavaScript 中有这么多类型的原型?它们都有什么作用?
当您开始学习 JavaScript 中的原型时,这似乎非常令人畏惧。很多混乱源于这样一个事实:JavaScript 中有两种不同的原型,它们引用了不同的概念。让我解释。


[[Prototype]]

[[Prototype]]是 Javascript 中所有对象都具有的隐藏私有属性,它保存对对象原型的引用。

对象的原型是对象继承或派生的对象。在下图中,对象son源自fatherson的原型是father。这意味着 的隐藏[[Prototype]]属性son指向father

javascript 7种继承-- JavaScript 中的 [[Prototype]] 与 __proto__ 与 .prototype 为什么 JavaScript 中有这么多类型的原型?_第1张图片

总结一下:

  • [[Prototype]]是引用对象原型的隐藏属性。
  • 对象的原型是对象派生或继承的对象。

__proto__

__proto__(也称为 Dunder Proto 或双下划线原型)是一个属性Object.prototype(稍后会详细介绍),它公开[[Prototype]]对象的隐藏属性并允许您访问或修改它。您不应该使用它,因为它已被弃用,尽管您可能会在旧代码中遇到它。

访问对象原型的现代方法是使用Object.getPrototypeOf(obj). **Object.setPrototypeOf(obj, prototype)**您还可以使用以下示例中所示的方法来修改对象的原型:
javascript 7种继承-- JavaScript 中的 [[Prototype]] 与 __proto__ 与 .prototype 为什么 JavaScript 中有这么多类型的原型?_第2张图片

总结一下:

  • __proto__是一种公开隐藏[[Prototype]]属性并允许您修改它的方法。
  • Object.getPrototypeOf()和Object.setPrototypeOf()是访问和设置对象原型的现代方法。

prototype

.prototype是几乎所有函数都具有的特殊属性,仅在函数作为构造函数调用时使用。我说几乎全部是因为使用简洁语法定义的箭头函数和方法没有.prototype属性,不能用作构造函数。

该*.prototype属性包含对对象的引用,当使用构造函数实例化或创建新对象时,该属性.prototype*被设置为新对象的原型。

构造函数就像一个对象工厂,它创建作为其自身实例的新对象。“什么是构造函数?

例如,当构造函数ObjectFactory用于实例化由obj以下代码块第 5 行的变量引用的新对象时,obj的隐藏内部**[[Prototype]]属性现在保存对由 引用的同一对象的引用ObjectFactory.prototype**。这意味着定义的任何属性或方法都ObjectFactory.prototype可以通过obj.

javascript 7种继承-- JavaScript 中的 [[Prototype]] 与 __proto__ 与 .prototype 为什么 JavaScript 中有这么多类型的原型?_第3张图片

在第 7 行,我们证明ObjectFactory.prototype引用了一个对象。在第 8 行我们证明这ObjectFactory.prototype是 的原型obj。

访问原型的属性

javascript 7种继承-- JavaScript 中的 [[Prototype]] 与 __proto__ 与 .prototype 为什么 JavaScript 中有这么多类型的原型?_第4张图片

prop请注意,在第 10 行,我们添加了一个名为所引用的对象的属性ObjectFactory.prototype。请记住,obj的[[Prototype]]属性引用与以下相同的对象ObjectFactory.prototype.

我们可以在第 12 行看到它obj没有名为 的属性prop,它只有一个名为 的属性property。但是,obj可以在第 13 行访问prop,因为它继承了其原型的属性,我们知道该原型是 引用的对象ObjectFactory.prototype。

总结

  • .prototype是所有函数都具有的特殊属性,其中包含对对象的引用。
  • 当构造函数用来实例化一个新对象时,ConstructorName.prototype被设置为新对象的原型。
  • 该构造函数的所有实例(它创建的对象)都可以访问 的属性ConstructorName.prototype。

Object.prototype在文章前面简单提到过,Object JavaScript 中几乎所有对象都是内置构造函数的实例,因此几乎所有对象都继承自其.prototype属性引用的对象Object.prototype

你可能感兴趣的:(JS,7种继承方式,javascript,继承,原型对象)