Share on facebook
Facebook
Share on google
Google+
Share on twitter
Twitter
Share on linkedin
LinkedIn

Constructeur

En Javascript, une fonction est considérée comme un objet. Il est donc possible de créer des propriétés (et des méthodes) sur cette fonction. En voici la démonstration.

let homme = function(){};
homme.nom = "dany";
homme.age = 30;
document.write("nom : " + homme.nom + ", age : " + homme.age);

Affichage

nom : dany, age : 30

Vous remarquez que les propriétés de la fonction sont bien affichées.

Le constructeur

Vous avez déjà rencontré le constructeur new pour la création d’un objet.

let monObjet = new Object();

Dans ce cas précis le constructeur créé un nouvel objet vide, qui ne possède ni propriété, ni méthode.

Mais si vous appliquez le constructeur sur une fonction (qui est aussi un objet) possédant une structure (des propriétés), l’objet créé hérite de cette structure. On utilisera l’opérateur this pour relier le nouvel objet aux propriétés de la fonction.

let Homme = function(nom,age){
    this.proprietAge = age;
    this.proprietNom = nom;
}
 
let moi = new Homme("dany",30);
document.write(moi.proprietAge);

Affichage

30

Le this dans la fonction représente l’objet qui sera ‘construit’ via l’opérateur new . Ici la fonction homme possède une structure, à savoir deux propriétés : ‘proprietAge’ et ‘proprietNom’.

Note : par convention, une fonction qui fait office d’objet commence par une majuscule.

Ajouter une méthode

Une méthode est aussi une fonction (encore!) mais qui est la valeur d’une propriété de la fonction constructeur (Homme).

let Homme = function(nom,age){
    this.proprietAge = age;
    this.proprietNom = nom;
    this.methodeDonneAge = function (){
        document.write("Mon age est " + this.proprietAge + " ans");
    }
}
 
let moi = new Homme("dany",30);
moi.methodeDonneAge();

Affichage

Mon age est 30 ans

Explication

Avec la syntaxe ‘this.methodeDonneAge = function()…’, la propriété methodeDonneAge devient de ce fait une méthode du constructeur Homme.

Pour chaque objet (ou instance) de Homme, comme l’objet ‘moi’, la méthode sera exécutée en appelant la proporiété methodeDonneAge suivi des parenthèses : ‘moi.methodeDonneAge();’

A lire aussi

tutowebdesign

Afficher du contenu au scroll

Afficher du contenu au scroll Voici un effet impressionnant et pourtant très facile à mettre en place sur vos pages. Le principe consiste à faire

Lire »
tutowebdesign

Créer un menu latéral animé

Créer un menu latéral animé Idéal pour les formats mobiles, voici un menu latéral animé facile à faire dont l’ouverture est déclenchée par Javascript. Commençons

Lire »
MegaphoNews - Closer Than Ever

The leading news agency comes to your smartphone.  Download now.

Politique d'utilisation des cookies

En poursuivant votre navigation sur ce site, vous acceptez l’utilisation de cookies. Les cookies nous permettent de personnaliser le contenu, les sorties et d’optimiser notre trafic.