Dans ce tutoriel, vous découvrirez le prototype JavaScript et son fonctionnement.
JavaScript dispose de la fonction intégrée Object(). L’opérateur typeof renvoie « function » si vous lui passez la fonction Object. Par exemple :
typeof(Object)Résultat :
'function'Veuillez noter que Object() est une fonction, et non un objet. Cela peut prêter à confusion si c’est la première fois que vous apprenez à connaître le prototype JavaScript.
L’objet Object.prototype possède quelques propriétés et méthodes utiles telles que toString() et valueOf().
Object.prototype possède également une propriété importante appelée constructor qui fait référence à la fonction Object().
L’instruction suivante confirme que la propriété Object.prototype.constructor fait référence à la fonction Object :
Tout d’abord, définissez une fonction constructeur appelée Personne comme suit :
function Personne(nom) {
this.nom = nom;
}Dans cet exemple, la fonction Persone() accepte un argument de nom et l’affecte à la propriété nom de l’objet this.
JavaScript crée une nouvelle fonction Person() et un objet anonyme :
Comme la fonction Object(), la fonction Person() possède une propriété appelée prototype qui fait référence à un objet anonyme. Et l’objet anonyme possède la propriété constructor qui fait référence à la fonction Personne().
L’illustration suivante montre la fonction Personne() et l’objet anonyme référencé par le prototype de la personne :
console.log(Personne);
console.log(Personne.prototype);En outre, JavaScript lie l’objet Person.prototype à l’objet Object.prototype via le [[Prototype]], ce qui est connu sous le nom de liaison de prototype.
Le lien de prototype est indiqué par [[Prototype]]
Définition de méthodes dans l’objet prototype JavaScript
Le texte suivant définit une nouvelle méthode appelée greet() dans l’objet Person.prototype :
Person.prototype.greet = function() {
return "Bonjour, je suis " + this.nom + "!";
}Dans ce cas, le moteur JavaScript ajoute la méthode greet() à l’objet Person.prototype.
L’exemple suivant crée une nouvelle instance de la personne :
let personne1 = new Personne('Mario');En interne, le moteur JavaScript crée un nouvel objet nommé p1 et lie l’objet p1 à l’objet Person.prototype via le lien prototype
Le lien entre p1, Person.prototype et Object.protoype s’appelle une chaîne de prototypes.
L’exemple suivant appelle la méthode greet() sur l’objet p1 :
let greeting = p1.greet();
console.log(greeting);Comme p1 ne possède pas la méthode greet(), JavaScript suit le lien du prototype et la trouve sur l’objet Person.prototype.
Puisque JavaScript peut trouver la méthode greet() sur l’objet Person.prototype, il exécute la méthode greet() et renvoie le résultat :
L’exemple suivant appelle la méthode toString() sur l’objet p1 :
let valeur = personnage.toString();
console.log(valeur);Dans ce cas, le moteur JavaScript suit la chaîne des prototypes pour rechercher la méthode toString() dans l’objet Person.prototype.
Comme le Person.prototype ne possède pas la méthode toString(), le moteur JavaScript remonte la chaîne des prototypes et recherche la méthode toString() dans l’objet Object.prototype.
Puisque JavaScript peut trouver la méthode toString() dans l’objet Object.prototype, il exécute la méthode toString().
En résumer :
- La fonction Object() possède une propriété appelée prototype qui fait référence à un objet Object.prototype.
- L’objet Object.prototype possède toutes les propriétés et méthodes disponibles dans tous les objets, telles que toString() et valueOf().
- L’objet Object.prototype possède la propriété constructor qui fait référence à la fonction Object.
- Chaque fonction possède un objet prototype. Cet objet prototype fait référence à l’objet Object.prototype via le lien [[prototype]] ou la propriété proto.
- La chaîne de prototypes permet à un objet d’utiliser les méthodes et les propriétés de ses objets prototypes via les liens [[prototype]].
- La méthode Object.getPrototypeOf() renvoie l’objet prototype d’un objet donné. Utilisez la méthode Object.getPrototypeOf() au lieu de proto.
