Compréhension approfondie de la chaîne de prototypes JavaScript et du mécanisme d'héritage

JavaScript est un langage de programmation flexible et puissant, et sa chaîne de prototypes unique et son mécanisme d'héritage sont l'une de ses principales fonctionnalités. Dans cet article, nous approfondirons la chaîne de prototypes et le mécanisme d'héritage en JavaScript pour aider les lecteurs à mieux comprendre ce concept important.


Qu'est-ce que la chaîne prototype ?

En JavaScript, chaque objet possède une référence qui est liée en interne à un autre objet, appelé prototype. Les objets prototypes peuvent contenir des propriétés et des méthodes, et d'autres objets peuvent hériter de ces propriétés et méthodes. Lorsque nous accédons à une propriété ou à une méthode d'un objet, JavaScript recherchera d'abord l'objet lui-même, et s'il ne peut pas le trouver, il recherchera la chaîne de prototypes jusqu'à ce qu'il trouve la propriété ou la méthode ou atteigne le sommet de la chaîne de prototypes.

Dans le code mentionné ci-dessus, nous avons défini deux classes Personet Studentet extendscréé Studentune sous-classe de la classe à l'aide du mot-clé Teacher. Nous pouvons implémenter l'héritage de méthodes via la chaîne de prototypes pour garantir que les sous-classes peuvent accéder aux méthodes de la classe parent.

Créer la chaîne de prototypes de l'objet

Chaque objet JavaScript possède une propriété intégrée __proto__qui pointe vers l'objet prototype du constructeur qui a créé l'objet. Ce maillon est la clé de la chaîne du prototype. Comprenons cela avec un exemple :

function Animal() {}
const dog = new Animal();

console.log(dog.__proto__); // 输出:Animal {}
console.log(Animal.prototype); // 输出:Animal {}
console.log(dog.__proto__ === Animal.prototype); // 输出:true

Dans l'exemple ci-dessus, nous avons créé un Animalconstructeur vide, puis newcréé un dogobjet nommé à l'aide du mot-clé. dog.__proto__Pointé vers Animal.prototype, afin que les propriétés et les méthodes qu'il contient dogpuissent être héritées .Animal.prototype

Héritage de chaînes de prototypes et réécriture de méthodes

En JavaScript, les sous-classes peuvent hériter des méthodes de la classe parent et peuvent également remplacer les méthodes héritées. Illustrons avec l'exemple de code donné ci-dessus :

class Person{
  constructor(name) {
    this.name=name;
  }
  introduce(){
    console.log(`Hello, I am ${this.name}`);
  }
  drink(){
    console.log('I am drinking');
  }
}
class Student extends Person{
  constructor(name,score) {
    super(name)
    this.score= score;
  }
  introduce(){
    console.log(`Hello, I am ${this.name}.and ${this.score}is my score`);
  }
}
const student =new Student('John', 100);
student.introduce();
class Teacher extends Person{
  constructor(name,subject){
    super(name)
    this.subject=subject;
  }
  introduce(){
    console.log(`Hello, I am ${this.name}.and ${this.subject}is my subject`);
  }
}
const teacher =new Teacher('John', 'Math');
teacher.introduce();
console.log(student)
teacher.drink();

Dans l'exemple ci-dessus, Studentla classe hérite Personde la classe et remplace introduce()la méthode. Lorsque nous appelons student.introduce(), il exécute la méthode Studentde la classe introduce(), pas Personla méthode de la classe.


L'héritage et le super mot-clé

Dans les sous-classes, nous pouvons utiliser superdes mots-clés pour appeler les constructeurs et les méthodes des classes parentes. Cela conserve les sous-classes liées à leurs classes parentes et ajoute des fonctionnalités supplémentaires aux sous-classes. Continuons l'exemple ci-dessus, Teacheren ajoutant une nouvelle méthode à la classe et en appelant le constructeur de la superclasse :

Dans l'exemple ci-dessus, en super(name)appelant Personle constructeur, nous nous assurons que Teacherle constructeur de la classe parent est également appelé pour l'initialisation lorsque la classe est instanciée.

class Teacher extends Person {
  constructor(name, subject) {
    super(name);
    this.subject = subject;
  }

  introduce() {
    console.log(`Hello, I am ${this.name}. and ${this.subject} is my subject`);
  }

  teach() {
    console.log('I am teaching');
  }
}

const teacher = new Teacher('John', 'Math');
teacher.introduce(); // 输出:Hello, I am John. and Math is my subject
teacher.teach(); // 输出:I am teaching

Résumer

La chaîne de prototypes et le mécanisme d'héritage de JavaScript sont l'une de ses fonctionnalités puissantes. Grâce à la chaîne de prototypes, les objets peuvent hériter des propriétés et des méthodes d'autres objets pour réaliser la réutilisation et l'organisation du code. Dans les sous-classes, nous pouvons extendshériter de la classe parent via des mots-clés et utiliser superdes mots-clés pour appeler les constructeurs et les méthodes de la classe parent. De cette façon, nous pouvons créer des structures de code plus flexibles et extensibles.

J'espère que cet article vous aidera à comprendre la chaîne de prototypes et le mécanisme d'héritage de JavaScript. Une solide compréhension de ce concept vous rendra plus à l’aise pour écrire du code JavaScript. Bon codage !

Je suppose que tu aimes

Origine blog.csdn.net/weixin_60895836/article/details/131900331
conseillé
Classement