Prototypes d'objets JavaScript


Tous les objets JavaScript héritent des propriétés et des méthodes d'un prototype.


Dans le chapitre précédent, nous avons appris à utiliser un constructeur d'objet :

Exemple

function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
}

const myFather = new Person("John", "Doe", 50, "blue");
const myMother = new Person("Sally", "Rally", 48, "green");
Essayez-le vous-même »

Nous avons également appris que vous ne pouvez pas ajouter une nouvelle propriété à un constructeur d'objet existant :

Exemple

Person.nationality = "English";
Essayez-le vous-même »

Pour ajouter une nouvelle propriété à un constructeur, vous devez l'ajouter à la fonction du constructeur :

Exemple

function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
this.nationality = "English";
}
Essayez-le vous-même »


Héritage de prototype

Tous les objets JavaScript héritent des propriétés et des méthodes d'un prototype :

  • Les objets Date héritent de Date.prototype
  • Les objets Array héritent de Array.prototype
  • Les objets Person héritent de Person.prototype

Le Object.prototype est au sommet de la chaîne d'héritage des prototypes :

Les objets Date , les objets Array et les objets Person héritent de Object.prototype .


Ajout de propriétés et de méthodes aux objets

Parfois, vous souhaitez ajouter de nouvelles propriétés (ou méthodes) à tous les objets existants d'un type donné.

Parfois, vous souhaitez ajouter de nouvelles propriétés (ou méthodes) à un constructeur d'objet.


Utilisation de la propriété prototype

La propriété prototype de JavaScript vous permet d'ajouter de nouvelles propriétés aux constructeurs d'objet :

Exemple

function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
}

Person.prototype.nationality = "English";
Essayez-le vous-même »

La propriété prototype de JavaScript vous permet également d'ajouter de nouvelles méthodes aux constructeurs d'objets :

Exemple

function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
}

Person.prototype.name = function() {
return this.firstName + " " + this.lastName;
};
Essayez-le vous-même »

Avertissement

Ne modifiez que vos propres prototypes. Ne modifiez jamais les prototypes des objets JavaScript standard.