Les Objets

JavaScript, bien qu'il partage des concepts de programmation orientée objet avec Java, présente des différences importantes dans la manière dont il gère les classes et les objets. Dans ce tutoriel, nous présentons les bases des classes et des objets en JavaScript.

Il existe plusieurs manières de gérer les ojets en JS. Nous avons pris le parti d'insister sur celle qui ressemble à celle que vous connaissez en Java. À la fin de ce tutoriel, nous montrerons quelques alternatives.

Déclaration d'une Classe

En JavaScript, la déclaration de classe suit un modèle similaire à celui de Java. Cependant, la syntaxe est plus concise :

class Personne {
  static nombreTotalPersonnes = 0; // un attribut statique
  constructor(nom, prenom){ //un constructeur à 2 paramètres
      this.nom = nom;  // deux attributs (publiques)
      this.prenom = prenom;
      Personne.nombreTotalPersonnes++;
  }
  identite = () => {
    console.log(`La personne s'appelle ${this.prenom} ${this.nom}`);
  }
  static afficherNombreTotalPersonnes = () => {
      console.log(`${Personne.nombreTotalPersonnes} instances de Personne ont été créées`);
  }
}

Comme en Java, on retrouve la notion de constructeurs et de méthodes.

Elle s'instancie et se manipule comme ceci :

let personne1 = new Personne("Journet", "Nicholas"); //une première instance
let personne2 = new Personne("Fossé", "Stéphane"); //une seconde
personne1.identite(); //2 appels à une méthode d'instance
personne2.identite(); //1 appel à une méthode d'instance
Personne.afficherNombreTotalPersonnes();

info

C'est tout pour le moment, nous verrons un peu plus tard l'héritage

Visibilité des attributs et méthodes

En JS on peut désormais définir (exactement comme en Java) des attributs et méthodes privées (le protected n'existe pas) à l'aide du caractère #

class MyClass {
  // Attribut privé
  #privateAttribute = "0";

  // Méthode privée
  #privateMethod = () => {
    this.#privateAttribute++;
    console.log("méthode privée");
  }

  // Méthode publique qui peut accéder aux membres privés
  publicMethod = () => {
    console.log("méthode publique");
    this.#privateMethod(); // Appel de la méthode privée
    console.log(this.#privateAttribute); // Accès à l'attribut privé
  }
}

// Création d'une instance de la classe
const myObject = new MyClass();

// Appel de la méthode publique qui peut accéder aux membres privés
myObject.publicMethod();

// Tentative d'accéder à l'attribut privé depuis l'extérieur de la classe (ne fonctionnera pas)
// console.log(myObject.#privateAttribute); // Produira une erreur
// Tentative d'appeler la méthode privée depuis l'extérieur de la classe (ne fonctionnera pas)
// myObject.#privateMethod(); // Produira une erreur

Exercices

Travail à faire

Copiez-collez ce code dans un fichier html, lancez un live serveur avec VSCODE et testez / débuggez à l'aide de votre navigateur.

//Modéliser une personne (nom, date d’anniversaire, liste d’amis)
//coder 3 méthodes (flechées) permetttant : 
  //d'ajouter des amis à une personne. Je peux avoir des amis potant le même nom
  //d'afficher le nombre d'amis et la liste de mes amis (utilisez un forEach ou un for-of)
  //d'afficher "je suis le plus vieux de ma bande d’amis" si c’est effectivement le cas, "je ne suis pas le plus vieux" sinon.

  class Person {
    /*
    Compléter ici (1 constructeur et  3 méthodes)
    */
}

function start() {
    let P1 = new Person("Nicho", new Date(1949, 11, 10));
    let P2 = new Person("Fred", new Date(1979, 9, 27));
    let P3 = new Person("Seb", new Date(1980, 11, 20));
    let P4 = new Person("Ed", new Date(1979, 2, 4));

    P1.addFriend(P2);
    P1.addFriend(P3);
    P1.addFriend(P4);
    //Cette manière de créer (puis ajouter) un ami est correcte , 
    //mais ne passe pas par le constructeur
    P1.addFriend({ name: "Fred", birthDay: new Date(1990, 5, 15) }); // Ajout d'un autre ami avec le même nom

    P1.sayNameFriends();
    console.log(P1.olderThanFriends() ? "Je suis le plus vieux de la bande" : "Je ne suis pas le plus vieux de la bande");
}

start();