Verständnis der JavaScript-Prototypkette

Jedes JavaScript-Objekt ist mit einem anderen Objekt verknüpft, und das zugehörige Objekt ist das, was wir als „Prototyp“ bezeichnen. Jedes Objekt erbt Eigenschaften und Methoden vom Prototyp. Es gibt ein spezielles Objekt, das keinen Prototyp hat, nämlich Object. Dies wird in den folgenden Abbildungen erläutert.

Zum Beispiel deklarieren wir zunächst eine Funktion Student():

function Student(name){
  this.name = name;
 this.hello = function(){
   alert(`Hello,${this.name}`);
 }
 }

Diese Funktion enthält einen Attributnamen und eine Methode hello .
In JavaScript können Sie die Student-Funktion über das Schlüsselwort new aufrufen (das Schreiben von new ist keine normale Funktion, das Schreiben von new ist ein Konstruktor) und gibt ein Objekt zurück, dessen Prototyp auf Student.prototype zeigt, wie unten gezeigt:

var xiaoming = new Student("xiaoming");
alert(xiaoming.name); // xiaoming
xiaoming.hello(); // Hello,xiaoming

Wenn wir bestätigen möchten, ob unsere Annahme richtig ist, möchten wir vergleichen, ob xiaoming.prototype und Student.prototype gleich sind.
Xiaming verfügt jedoch nicht über ein Prototypattribut, Sie können es jedoch mit __proto__ anzeigen. Als Nächstes verwenden wir diese Attribute, um die Prototypkette zwischen Xiaoming, Student und Objekt anzuzeigen:

document.onreadystatechange = function(){
 // interactive表示文档已被解析，但浏览器还在加载其中链接的资源
 if(document.readyState === "interactive"){
  var xiaoming = new Student("xiaoming");
  alert(xiaoming.name);
  xiaoming.hello();
  console.log("xiaoming.__proto__：");
  console.log(xiaoming.__proto__);
  console.log("Student.prototype：");
  console.log(Student.prototype);
  console.log("xiaoming.__proto__ === Student.prototype：" + xiaoming.__proto__ === Student.prototype);
  console.log("Student.prototype.constructor：" + Student.prototype.constructor);
  console.log("Student.prototype.prototype：" + Student.prototype.prototype);
  console.log("Student.prototype.__proto__：");
  console.log(Student.prototype.__proto__);
  console.log(Object.prototype);
  console.log("Student.prototype.__proto__ === Object.prototype：" + Student.prototype.__proto__ === Object.prototype);
 }
}