Constructeurs d'objets JavaScript
Fonctions de constructeur d'objet
Parfois, nous devons créer de nombreux objets du même type .
Pour créer un type d'objet , nous utilisons une fonction de constructeur d'objet .
Il est considéré comme une bonne pratique de nommer les fonctions de constructeur avec une majuscule au début.
Type d'objet Personne
function Person(first, last, age, eye) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eye;
} Remarque :
Dans la fonction de constructeur, this n'a pas de valeur.
La valeur de this deviendra le nouvel objet lorsqu'un nouvel objet sera créé.
Voir aussi :
Maintenant, nous pouvons utiliser new Person() pour créer de nombreux nouveaux objets Personne :
Exemple
const myFather = new Person("John", "Doe", 50, "blue");
const myMother = new Person("Sally", "Rally", 48, "green");
const mySister = new Person("Anna", "Rally", 18, "green");
const mySelf = new Person("Johnny", "Rally", 22, "green");
Valeurs par défaut des propriétés
Une valeur donnée à une propriété sera une valeur par défaut pour tous les objets créés par le constructeur :
Exemple
function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
this.nationality = "Anglais";
} Ajouter une propriété à un objet
Ajouter une propriété à un objet créé est facile :
Exemple
myFather.nationality = "Anglais"; Remarque :
La nouvelle propriété sera ajoutée à myFather , et non à d'autres objets Personne .
Ajouter une propriété à un constructeur
Vous ne pouvez PAS ajouter une nouvelle propriété à un constructeur d'objet :
Exemple
Person.nationality = "Anglais"; Pour ajouter une nouvelle propriété, vous devez l'ajouter au prototype de la fonction constructeur :
Exemple
Person.prototype.nationality = "Anglais"; Méthodes de fonction constructeur
Une fonction constructeur peut également avoir des méthodes :
Exemple
function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
this.fullName = function() {
return this.firstName + " " + this.lastName;
};
} Ajouter une méthode à un objet
Ajouter une méthode à un objet créé est facile :
Exemple
myMother.changeName = function (name) {
this.lastName = name;
} Remarque :
La nouvelle méthode sera ajoutée à myMother , et non à d'autres objets Personne .
Ajouter une méthode à un constructeur
Vous ne pouvez pas ajouter une nouvelle méthode à une fonction constructeur d'objet.
Ce code produira une TypeError :
Exemple
Person.changeName = function (name) {
this.lastName = name;
}
myMother.changeName("Doe"); TypeError: myMother.changeName n'est pas une fonction
Ajouter une nouvelle méthode doit se faire au prototype de la fonction constructeur :
Exemple
Person.prototype.changeName = function (name) {
this.lastName = name;
}
myMother.changeName("Doe"); Remarque :
La fonction changeName() assigne la valeur de name à la propriété lastName de la personne, substituant this par myMother .
Constructeurs JavaScript intégrés
JavaScript a des constructeurs intégrés pour tous les objets natifs :
new Object() // Un nouvel objet Object
new Array() // Un nouvel objet Array
new Map() // Un nouvel objet Map
new Set() // Un nouvel objet Set
new Date() // Un nouvel objet Date
new RegExp() // Un nouvel objet RegExp
new Function() // Un nouvel objet Function
Remarque :
L'objet Math() n'est pas dans la liste. Math est un objet global. Le mot-clé new ne peut pas être utilisé sur Math .
Le saviez-vous ?
Utilisez des littéraux d'objet {} au lieu de new Object() .
Utilisez des littéraux de tableau [] au lieu de new Array() .
Utilisez des littéraux de motif /()/ au lieu de new RegExp() .
Utilisez des expressions de fonction () {} au lieu de new Function() .
Exemple
""; // chaîne primitive
0; // nombre primitif
false; // booléen primitif
{}; // objet objet
[]; // objet tableau
/()/ // objet regexp
function(){}; // fonction En savoir plus :
Définitions d'objets JavaScript
Constructeurs d'objets JavaScript
Déstructuration d'objets JavaScript
Prototypes d'objets JavaScript
Itérations d'objets JavaScript
Accesseurs et mutateurs d'objets JavaScript