Rappel sur la notion de propriété de classe
Avant d'aborder la notion de méthode d'instance, sur laquelle nous allons nous concentrer dans ce cours, il est important d’expliquer la notion de propriété de classe. C’est une variable interne à cette classe que l’on peut définir par défaut et faire évoluer au fur et à mesure de l’exécution de notre code. Il n’est pas rare d’utiliser le terme “attribut” au lieu de "propriété", mais cela représente bien la même chose.
Prenons l’exemple d’une classe qui représenterait un compte bancaire, et que l’on appellerait du coup BankAccount
. On pourrait trouver comme propriétés owner
(permettant d’identifier le propriétaire du compte) et balance
(permettant de connaître le montant disponible sur le compte). Ainsi, lorsque que l’on crée une instance de BankAccount
avec un propriétaire et un montant initial en argument, on pourra exploiter par la suite ces propriétés pour afficher leurs valeurs, les utiliser pour des calculs, les modifier, etc.
Tirez parti des classes avec des méthodes d'instance
Si vous revenez au chapitre sur les classes, nous les avons utilisées pour créer des objets ayant certaines propriétés. Maintenant que vous avez commencé à découvrir les fonctions, vous pouvez ajouter des méthodes d'instance à ces classes, pour augmenter leur puissance et leur utilité.
Une méthode d'instance est une fonction faisant partie d'une classe, et qui agit sur une instance de cette classe. Reprenons notre exemple de classe BankAccount
(compte bancaire) :
class BankAccount {
constructor(owner, balance) {
this.owner = owner;
this.balance = balance;
}
}
Vous pouvez ensuite créer une instance de cette classe appelée newAccount
(nouveau compte) :
const newAccount = new BankAccount("Will Alexander", 500);
Telle quelle, l'instance n'est pas très utile. Vous pourriez afficher son solde à la console par newAccount.balance
, mais si on pensait plutôt à ajouter une mise en forme ? Vous pouvez pour cela ajouter une méthode à la classe !
class BankAccount {
constructor(owner, balance) {
this.owner = owner;
this.balance = balance;
}
showBalance() {
console.log("Solde: " + this.balance + " EUR");
}
}
La nouvelle méthode ci-dessus, déclarée par son nom suivi par (), utilise le mot clé this
pour accéder à la propriété balance
de l'instance, et l'afficher sur la console avec une mise en forme supplémentaire. Ceci signifie que vous pouvez utiliser la notation dot sur l'instance newAccount
pour appeler sa méthode showBalance()
:
const newAccount = new BankAccount("Will Alexander", 500);
newAccount.showBalance(); // imprime "Solde: 500 EUR" à la console
Vous pouvez aussi ajouter des méthodes capables de modifier les propriétés de l'instance. Dans ce cas, ajoutez les méthodes deposit()
(dépôt) et withdraw()
(retrait) à la classe, en n'oubliant pas que les deux ont besoin d'un paramètre amount
(montant) (parce que vous devez savoir combien déposer ou retirer !) :
class BankAccount {
constructor(owner, balance) {
this.owner = owner;
this.balance = balance;
}
showBalance() {
console.log("Solde: " + this.balance + " EUR");
}
deposit(amount) {
console.log("Dépôt de " + amount + " EUR");
this.balance += amount;
this.showBalance();
}
withdraw(amount) {
if (amount > this.balance) {
console.log("Retrait refusé !");
} else {
console.log("Retrait de " + amount + " EUR");
this.balance -= amount;
this.showBalance();
}
}
}
La méthode deposit()
affiche le montant du dépôt sur la console, ajoute le montant au solde de l'instance, puis appelle la méthode showBalance()
de l'instance, imprimant ainsi le nouveau solde sur la console.
La méthode withdraw()
vérifie si le montant demandé est supérieur au solde actuel. Si c'est le cas, il refuse le retrait ; sinon, il l'autorise, en soustrayant le montant du solde et en affichant le nouveau solde sur la console.
Pratiquez les méthodes instance
Voyons maintenant comment utiliser des méthodes d'instance pour enregistrer l'application de diffusion vidéo.
Rendez-vous sur cet éditeur CodePen.
Plutôt que d'utiliser une fonction pour calculer la note moyenne pour une série, on a décidé que la classe Show (ou "Série") devrait gérer les nouvelles notes automatiquement.
Comme vous pouvez le constater, la classe Show
contient un Array ratings
, pour les notes, qui est initialisé vide, et une propriété averageRating
(note moyenne) de zéro.
Déclarez une méthode instance dans la classe
Show
appeléeaddRating()
. Elle prendra unerating
(la note), qui sera un nombre entre 1 et 5, comme paramètre.La méthode
addRating()
doit :
ajouter la note reçue au tableau
ratings
de l'instance ;recalculer la valeur
averageRating
de l'instance.
Cliquez sur le bouton "Check ratings" pour vérifier si les séries se mettent à jour correctement. Vous pouvez cliquer plusieurs fois sur le bouton pour voir l'évolution des notes moyennes.
Solution
Voici un nouveau CodePen avec une solution à l’exercice.
Découvrez les méthodes statiques
Il existe un type spécial de méthode pouvant être ajoutée à une classe : la méthode statique. Elle est différente des méthodes d'instance parce qu'elle n'est pas liée à une instance particulière d'une classe, mais à la classe elle-même. Utilisez-la pour créer des méthodes utilitaires (helper en anglais) où vous n'aurez pas besoin d'une instance d'une classe pour les utiliser. Vous pourrez vous en servir comme boîte à outils de fonctions que vous utiliserez souvent.
Par exemple, en JavaScript, l'objet Math
contient beaucoup de méthodes utiles :
const randomNumber = Math.random(); // crée un nombre aléatoire sur l'intervalle [0, 1]
const roundMeDown = Math.floor(495.966); // arrondit vers le bas à l'entier le plus proche, renvoie 495
Vous n'avez pas besoin de créer par new
une instance de l'objet Math
pour utiliser ces méthodes ; il suffit de les appeler sur l'objet Math
global.
Vous pouvez créer vos propres méthodes statiques par le mot clé static
!
Observons la classe suivante :
class BePolite {
static sayHello() {
console.log("Hello!");
}
static sayHelloTo(name) {
console.log("Hello " + name + "!");
}
static add(firstNumber, secondNumber) {
return firstNumber + secondNumber;
}
}
BePolite.sayHello(); // imprime "Hello!""
BePolite.sayHelloTo("Will"); // imprime "Hello Will!""
const sum = BePolite.add(2, 3); // sum = 5
Vous n'avez pas besoin d'ajouter un constructor
à votre classe, car vous n'allez pas l'instancier. Vous avez une méthode qui :
imprime un message générique ;
accepte un argument et l'utilise pour créer un message ;
renvoie une valeur à partir des arguments que vous lui envoyez.
Toutes ces fonctionnalités pourraient être des fonctions, mais l'avantage d'utiliser des méthodes de classe statiques est par exemple de pouvoir les regrouper par catégorie ou par type.
En résumé
Dans ce chapitre, nous nous sommes intéressés à deux types de méthodes de classe :
les méthodes d'instance, qui agissent sur les instances individuelles d'une classe ;
les méthodes statiques, qui ne s'appuient pas sur une instance d'une classe.
Dans le chapitre qui suit, nous allons voir comment écrire des fonctions, et du code propre qui soit facile à lire, à maintenir et à adapter !