Heim  >  Artikel  >  Web-Frontend  >  Verstehen Sie die Eigenschaften und Verwendungsmöglichkeiten von Prototypen und Prototypenketten

Verstehen Sie die Eigenschaften und Verwendungsmöglichkeiten von Prototypen und Prototypenketten

王林
王林Original
2024-01-10 12:15:001176Durchsuche

Verstehen Sie die Eigenschaften und Verwendungsmöglichkeiten von Prototypen und Prototypenketten

Erkunden Sie die Eigenschaften und Anwendungen von Prototypen und Prototypketten

1 Was sind Prototypen und Prototypketten? In JavaScript hat jedes Objekt ein Prototypobjekt. Ein Prototypobjekt ist ebenfalls ein Objekt und kann Eigenschaften und Methoden haben. Objekte in JavaScript basieren auf Prototypen, was bedeutet, dass ein Objekt die Eigenschaften und Methoden eines anderen Objekts erben kann.

Das Prototypobjekt des Objekts kann über das Attribut

, das eine Referenz auf das Prototypobjekt ist, auf das Prototypobjekt des Objekts verweisen. Über die Prototypenkette können Objekte entlang der Prototypenkette nach Eigenschaften und Methoden suchen.

__proto__属性来访问。这个__proto__2. Eigenschaften von Prototypen

Die Prototypobjekte von Objekten werden gemeinsam genutzt. Wenn wir in JavaScript ein neues Objekt erstellen, wird es automatisch einem Prototypobjekt zugeordnet. Mehrere Objekte können demselben Prototypobjekt zugeordnet werden, wodurch Eigenschaften und Methoden im Prototypobjekt gemeinsam genutzt werden.
  1. Codebeispiel:
function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.greet = function() {
  console.log('Hello, ' + this.name + '!');
};

var person1 = new Person('Alice', 20);
var person2 = new Person('Bob', 25);

console.log(person1.__proto__ === person2.__proto__);  // true

Objekte können die Eigenschaften und Methoden von Prototypobjekten verwenden. Wenn wir auf eine Eigenschaft eines Objekts zugreifen oder eine Methode für ein Objekt aufrufen und das Objekt selbst nicht über diese Eigenschaft oder Methode verfügt, wird es entlang der Prototypenkette nachgeschlagen.
  1. Codebeispiel:
person1.greet();  // Hello, Alice!

console.log(person1.hasOwnProperty('name'));  // true,对象自身有name属性
console.log(person1.hasOwnProperty('greet'));  // false,对象自身没有greet方法

console.log(person1.__proto__.hasOwnProperty('greet'));  // true,原型对象有greet方法

person1.name = 'Eve';

console.log(person1.hasOwnProperty('name'));  // true,对象自身有name属性,不会修改原型对象的属性

3. Eigenschaften der Prototypenkette

Die Prototypenkette ist eine Beziehung zwischen Objekten. Durch die Prototypenkette kann ein Objekt Ebene für Ebene nach Eigenschaften und Methoden suchen, bis es die Spitze der Prototypenkette findet oder erreicht.
  1. Die Prototypenkette ist linear. In der Prototypenkette hat jedes Objekt nur einen Prototyp, sein übergeordnetes Objekt.
  2. Codebeispiel:
function Animal(name) {
  this.name = name;
}

function Cat(name, color) {
  this.name = name;
  this.color = color;
}

Cat.prototype = new Animal();

var cat = new Cat('Tom', 'blue');

console.log(cat instanceof Cat);  // true
console.log(cat instanceof Animal);  // true

console.log(cat.hasOwnProperty('name'));  // true,对象自身有name属性
console.log(cat.hasOwnProperty('color'));  // true,对象自身有color属性

console.log(cat.__proto__ === Cat.prototype);  // true
console.log(Cat.prototype.__proto__ === Animal.prototype);  // true
console.log(Animal.prototype.__proto__ === Object.prototype);  // true,原型链的顶端是Object.prototype

4. Anwendung von Prototypen und Prototypenketten

Vererbung: Durch die Prototypenkette kann die Vererbungsbeziehung zwischen Objekten realisiert werden. Das Prototypobjekt des untergeordneten Objekts zeigt auf das übergeordnete Objekt, sodass das untergeordnete Objekt die Eigenschaften und Methoden des übergeordneten Objekts erben kann.
  1. Codebeispiel:
function Animal(name) {
  this.name = name;
}

Animal.prototype.eat = function() {
  console.log(this.name + ' is eating.');
};

function Cat(name, color) {
  this.name = name;
  this.color = color;
}

Cat.prototype = new Animal();

var cat = new Cat('Tom', 'blue');

cat.eat();  // Tom is eating.

Freigabe von Eigenschaften und Methoden: Durch Prototypobjekte kann die gemeinsame Nutzung von Eigenschaften und Methoden zwischen mehreren Objekten erreicht werden. Dies spart Speicherplatz, insbesondere wenn mehrere Instanzen dieselben Eigenschaften und Methoden gemeinsam nutzen müssen.
  1. Codebeispiel:
function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHi = function() {
  console.log('Hi, I am ' + this.name);
};

var person1 = new Person('Alice', 20);
var person2 = new Person('Bob', 25);

person1.sayHi();  // Hi, I am Alice
person2.sayHi();  // Hi, I am Bob

Zusammenfassung:

Prototyp und Prototypkette sind wichtige Konzepte in JavaScript. Sie bilden den Vererbungs- und Freigabemechanismus zwischen Objekten. Durch Prototypen und Prototypketten können wir die Eigenschaften und Methoden von Objekten besser organisieren und verwalten sowie die Wiederverwendbarkeit und Wartbarkeit des Codes verbessern. In der tatsächlichen Entwicklung tragen ein tiefes Verständnis und Kenntnisse in der Verwendung der Eigenschaften und Anwendungen von Prototypen und Prototypketten dazu bei, die JavaScript-Programmierkenntnisse zu verbessern.

Das obige ist der detaillierte Inhalt vonVerstehen Sie die Eigenschaften und Verwendungsmöglichkeiten von Prototypen und Prototypenketten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn