Maison > interface Web > js tutoriel > le corps du texte

Analyse approfondie des propriétés et caractéristiques des prototypes et des chaînes de prototypes

WBOY
Libérer: 2024-01-10 15:30:35
original
1010 Les gens l'ont consulté

Analyse approfondie des propriétés et caractéristiques des prototypes et des chaînes de prototypes

Une explication approfondie des caractéristiques des prototypes et des chaînes de prototypes nécessite des exemples de code spécifiques

1 Les concepts de prototypes et de chaînes de prototypes
Lors de l'apprentissage de JavaScript, nous rencontrons souvent les deux concepts de "prototype" et de "prototype". chaîne" . Ce sont des concepts très importants en JavaScript, et comprendre leurs caractéristiques est crucial pour pouvoir utiliser correctement le langage JavaScript.

En JavaScript, chaque objet possède une propriété privée (__proto__) qui pointe vers l'objet prototype du constructeur qui a créé l'objet.

Tout d’abord, comprenons le concept de prototype. Dans le monde de JavaScript, presque tout est objet. Lorsque nous créons un objet, JavaScript attache un prototype à l'objet. Lorsque nous accédons à une propriété ou une méthode sur cet objet, si l'objet lui-même ne possède pas cette propriété ou cette méthode, JavaScript la recherchera en fonction de la chaîne de prototypes de l'objet.

Alors c'est quoi la chaîne prototype ? La chaîne prototype se produit lorsque plusieurs objets sont connectés les uns aux autres via l'attribut __proto__ pour former une chaîne. Le prototype d'un objet peut être un autre objet. Si le prototype de l'objet n'est pas vide, JavaScript continue de rechercher le prototype du prototype jusqu'à ce qu'il trouve une propriété ou une méthode. Ce processus forme la chaîne de prototypes.

2. Création de prototypes
Nous pouvons utiliser des littéraux d'objet ou des constructeurs pour créer des objets. Voici un exemple d'utilisation de littéraux d'objet pour créer des objets :

const person = {
  name: 'Tom',
  age: 20,
  sayHello() {
    console.log(`Hello, my name is ${this.name}`);
  }
};
Copier après la connexion

Dans cet exemple, nous créons un objet personne et lui ajoutons des attributs de nom et d'âge, ainsi qu'une méthode sayHello.

Nous pouvons utiliser des constructeurs pour créer plusieurs objets similaires. Le constructeur est en fait une fonction ordinaire, mais il est d'usage de mettre la première lettre en majuscule. Voici un exemple d'utilisation d'un constructeur pour créer un objet :

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name}`);
}

const person1 = new Person('Tom', 20);
const person2 = new Person('Jerry', 18);
Copier après la connexion

Dans cet exemple, nous définissons un constructeur Person et lui ajoutons des attributs name et age, ainsi qu'une méthode sayHello. Lors de la création d'un objet via le mot-clé new et le constructeur, JavaScript créera automatiquement un objet prototype et pointera l'attribut __proto__ de l'objet vers l'objet prototype du constructeur.

3. Héritage du prototype
Le prototype peut réaliser l'héritage des objets. Si le prototype d'un objet est un autre objet, il hérite des propriétés et méthodes de l'autre objet.

const animal = {
  eat() {
    console.log('Animal is eating');
  }
};

const dog = {
  bark() {
    console.log('Dog is barking');
  }
};

dog.__proto__ = animal;

dog.eat(); // 输出 Animal is eating
Copier après la connexion

Dans cet exemple, nous créons un objet animal et un objet chien. Ensuite, nous définissons le prototype de l'objet chien sur l'objet animal, de sorte que l'objet chien hérite de la méthode eat de l'objet animal.

En plus de définir le prototype via l'attribut __proto__, nous pouvons également utiliser la méthode Object.create() pour créer un objet avec un prototype spécifié. Par exemple :

const animal = {
  eat() {
    console.log('Animal is eating');
  }
};

const dog = Object.create(animal);

dog.bark = function() {
  console.log('Dog is barking');
};

dog.eat(); // 输出 Animal is eating
Copier après la connexion

Dans cet exemple, nous créons un objet chien à l'aide de la méthode Object.create() et définissons son prototype sur un objet animal.

4. Caractéristiques de la chaîne prototype
La chaîne prototype peut réaliser un héritage multicouche. Le prototype d'un objet peut pointer vers un autre objet, et le prototype de cet objet peut pointer vers un autre objet, et ainsi de suite, formant une chaîne de prototypes.

Ce qui suit est un exemple de chaîne de prototype simplifié :

const animal = {
  eat() {
    console.log('Animal is eating');
  }
};

const dog = {
  bark() {
    console.log('Dog is barking');
  }
};

dog.__proto__ = animal;

const husky = {
  furColor: 'white'
};

husky.__proto__ = dog;

husky.eat(); // 输出 Animal is eating
husky.bark(); // 输出 Dog is barking
console.log(husky.furColor); // 输出 white
Copier après la connexion

Dans cet exemple, nous avons créé trois objets : animal, chien et husky. Une chaîne de prototypes est formée en définissant l'attribut __proto__. Par conséquent, l’objet husky hérite des propriétés et méthodes de l’objet animal et de l’objet chien.

Si un objet ne trouve pas de propriété ou de méthode sur la chaîne de prototypes, JavaScript continuera à rechercher dans le prochain objet prototype de la chaîne de prototypes. Jusqu'à ce que toute la chaîne de prototypes soit recherchée, si la propriété ou la méthode ne peut pas être trouvée, elle renverra undéfini.

5. Conclusion
Le prototype et la chaîne de prototypes sont des concepts très importants en JavaScript. Comprendre leurs caractéristiques est très important pour nous pour écrire du code JavaScript efficace et élégant.

Nous pouvons utiliser des littéraux d'objet ou des constructeurs pour créer des objets, et utiliser des prototypes pour implémenter l'héritage. En définissant l'attribut __proto__ ou en utilisant la méthode Object.create(), nous pouvons connecter plusieurs objets pour former une chaîne de prototypes.

En maîtrisant les caractéristiques des prototypes et des chaînes de prototypes, nous pouvons mieux comprendre le modèle objet JavaScript et être capables d'utiliser et d'hériter de manière flexible des objets existants, améliorant ainsi la réutilisabilité et la maintenabilité du code.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!