Les objets JavaScript

Introduction

En JavaScript, la notion de classe n’existe pas et le langage n’est pas typé. C’est la différence avec PHP, mais on peut simuler le même comportement qu’en PHP en déclarant des pseudo-entités de classes, dont les attributs représenteront les variables et les méthodes seront les fonctions.

En effet, tout fonctionne en se fondant sur des objets, c’est-à-dire que toute entité ou structure peut être vue en tant qu’objet.

Une variable ne contient qu’une seule valeur, un objet est beaucoup plus, il peut contenir plusieurs valeurs, et même des fonctions.

Déclarer et utiliser un objet

Il y a plusieurs moyens de déclarer un objet en JavaScript, puisque tout est objet.

Pour comprendre la première façon de faire, on va suivre la création d’un exemple autour d’un objet personne, très simplifié.

Une personne possède en général un nom, un prénom, et un âge. On pourrait donc déclarer notre objet comme un tableau d’attributs :


<script> 
     var personne = { 
            nom      : "Durand",  
            prenom   : "Michel",  
            age      : 35 
     }; 
</script>

En fait, cette structure est bien connue des développeurs, il s’agit d’une structure JSON, qui est un format de données.

Pour accéder aux propriétés d’un objet, vous utiliserez le point (.) comme on l’a vu à plusieurs reprises dans les chapitres précédents avec l’objet document :


personne.nom

ou alors :


personne['nom']


<script>   
    var personne  = { 
           nom    : "Durand",  
           prenom : "Michel",  ...

Convention et bonne pratique de nommage

Vous avez vu dans l’exemple précédent que l’objet personne se comporte comme en PHP et qu’il est aussi à la fois le constructeur (que l’on retrouve sous la forme d’une fonction magique __construct() en PHP).

Cet objet pourra donc être instancié autant de fois que vous le voulez, et les bonnes pratiques de programmation veulent que l’on nomme cet objet avec une majuscule en première lettre :


<script>   
    function Personne(nom, prenom, age) {

Le mot-clé prototype

Cette partie n’est pas évidente à appréhender, toutefois, dans les grandes lignes, le prototype en JavaScript permet de mettre en place l’héritage.

Le prototype est une propriété de l’objet function dès que l’on appelle le constructeur d’une fonction, c’est-à-dire dès que l’on instancie un objet (à l’aide de l’instruction new) :


<script> 
  personne1 = new Personne("Durand", "Michel", "35") 
  ... 
</script>

Cette instanciation va automatiquement créer une propriété prototype sur l’objet Personne comme ceci :


personne1.prototype

Cette propriété est un objet qui contient toutes les méthodes (fonctions) et tous les attributs (propriétés) accessibles par les instances de la fonction, par exemple :


<script>   
    function Personne(nom, prenom) {  
           this.nom = nom 
           this.prenom = prenom 
           personne.prototype.hello = function {     
                  document.write("Bonjour " + this.nom + " " + 
this.prenom + ".<br>")  
    } ...