Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Apprendre Accesseurs et Mutateurs | Classes
Maîtrise Avancée de JavaScript

bookAccesseurs et Mutateurs

Les accesseurs (getters) et les mutateurs (setters) offrent un moyen puissant de contrôler l'accès aux propriétés d'un objet en JavaScript.

Qu'est-ce que les Getters et Setters ?

En JavaScript, les getters et setters sont des méthodes spéciales qui permettent un accès contrôlé aux propriétés d'un objet. Ils vous offrent la flexibilité de définir comment une propriété est récupérée et modifiée tout en protégeant l'état interne de l'objet.

  • Getter : Une méthode utilisée pour récupérer (get) la valeur d'une propriété ;
  • Setter : Une méthode utilisée pour définir ou mettre à jour la valeur d'une propriété.

Pensez à un coffre-fort de banque. Le coffre contient des objets de valeur (propriétés privées), et le guichetier (getter/setter) agit comme le gardien. Vous ne pouvez pas accéder directement au coffre, mais le guichetier peut récupérer ou mettre à jour des objets pour vous en fonction de certaines règles et validations.

Comment Définir et Utiliser les Getters et Setters

Les getters et setters sont définis à l'aide des mots-clés get et set à l'intérieur d'une classe. Lorsque vous accédez à une propriété, le getter est automatiquement invoqué. De même, lorsque vous modifiez une propriété, le setter est appelé au lieu de modifier directement la propriété.


              
12345678910111213141516171819202122232425262728293031323334

            
class Animal {
  #type; // Private field

  constructor(name, type) {
    this.name = name;
    this.#type = type; // Assigning the private field
  }

  // Getter for the type property
  get type() {
    return this.#type;
  }

  // Setter for the type property
  set type(newType) {
    if (newType) {
      this.#type = newType;
    } else {
      console.log('Invalid type');
    }
  }
}

const lion = new Animal('Lion', 'Wild');

// Using getter to access the private type
console.log(lion.type); // Output: Wild

// Using setter to modify the private type
lion.type = 'Domestic';
console.log(lion.type); // Output: Domestic

// Trying to set an invalid value
lion.type = ''; // Output: Invalid type
copy

Dans cet exemple, #type est une propriété privée, et nous définissons un getter (get type()) pour récupérer sa valeur et un setter (set type(newType)) pour la modifier. Le setter inclut une validation pour empêcher la définition d'une valeur invalide, démontrant comment vous pouvez contrôler les mises à jour des données privées.

Avantages des Getters et Setters

Accès Contrôlé

  • Les getters vous permettent de définir comment la valeur d'une propriété est accédée, vous permettant de traiter ou de manipuler la valeur avant de la retourner ;
  • Les setters vous donnent le contrôle sur la façon dont une propriété est mise à jour, vous permettant de valider ou de transformer les données avant de les attribuer à un champ privé.

Protection des Données

  • L'utilisation de getters et setters aide à protéger l'état interne d'un objet en fournissant une interface contrôlée pour l'interaction ;
  • Les propriétés privées peuvent rester cachées, et vous pouvez exposer uniquement les informations nécessaires au code externe.

Flexibilité

Les getters et setters vous permettent d'ajouter une logique supplémentaire—comme la validation ou la journalisation—lors de l'accès ou de la modification des propriétés sans altérer la façon dont le code externe interagit avec l'objet.

Exemple : Compte Utilisateur avec Validation de Mot de Passe

Imaginez que vous gérez des comptes utilisateurs où les mots de passe doivent répondre à certaines normes de sécurité. En utilisant un setter, vous pouvez imposer la robustesse du mot de passe, tandis qu'un getter pourrait récupérer une version masquée du mot de passe à des fins d'affichage.


              
12345678910111213141516171819202122232425262728293031323334

            
class UserAccount {
  #password; // Private field

  constructor(username, password) {
    this.username = username;
    this.#password = password;
  }

  // Getter for password (returning a masked version)
  get password() {
    return '*'.repeat(this.#password.length); // Mask the password when retrieved
  }

  // Setter for password with validation
  set password(newPassword) {
    if (newPassword.length >= 8) {
      this.#password = newPassword;
    } else {
      console.log('Password must be at least 8 characters long');
    }
  }
}

const user = new UserAccount('nick_feather', 'secret123');

// Accessing the password using the getter (masked)
console.log(user.password); // Output: *********

// Setting a new valid password using the setter
user.password = 'strongPassword123';
console.log(user.password); // Output: ***************

// Trying to set an invalid password
user.password = '123'; // Output: Password must be at least 8 characters long
copy

Dans cet exemple, le getter retourne une version masquée du mot de passe pour cacher la valeur réelle, et le setter impose une validation du mot de passe, garantissant que le mot de passe comporte au moins 8 caractères.

Exemple avec logique de validation utilisant les getters et setters

Voici un autre exemple où nous gérons l'âge d'une personne et nous assurons que la valeur reste dans une plage raisonnable :


              
12345678910111213141516171819202122232425262728293031323334

            
class Person {
  #age; // Private field

  constructor(name, age) {
    this.name = name;
    this.#age = age;
  }

  // Getter for age
  get age() {
    return this.#age;
  }

  // Setter for age with validation
  set age(newAge) {
    if (newAge > 0 && newAge < 120) {
      this.#age = newAge;
    } else {
      console.log('Invalid age');
    }
  }
}

const peter = new Person('Peter', 30);

// Accessing the age using the getter
console.log(peter.age); // Output: 30

// Setting a new valid age using the setter
peter.age = 35;
console.log(peter.age); // Output: 35

// Trying to set an invalid age
peter.age = 150; // Output: Invalid age
copy

Cet exemple démontre comment un setter peut s'assurer qu'un âge reste dans une plage valide, empêchant ainsi le stockage de données invalides.

1. Quel est le but principal de l'utilisation des getters ?

2. Dans le code suivant, que va afficher console.log(user.password); ?

question mark

Quel est le but principal de l'utilisation des getters ?

Select the correct answer

question mark

Dans le code suivant, que va afficher console.log(user.password); ?

Select the correct answer

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 1. Chapitre 9

Demandez à l'IA

expand

Demandez à l'IA

ChatGPT

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

Awesome!

Completion rate improved to 2.22

bookAccesseurs et Mutateurs

Glissez pour afficher le menu

Les accesseurs (getters) et les mutateurs (setters) offrent un moyen puissant de contrôler l'accès aux propriétés d'un objet en JavaScript.

Qu'est-ce que les Getters et Setters ?

En JavaScript, les getters et setters sont des méthodes spéciales qui permettent un accès contrôlé aux propriétés d'un objet. Ils vous offrent la flexibilité de définir comment une propriété est récupérée et modifiée tout en protégeant l'état interne de l'objet.

  • Getter : Une méthode utilisée pour récupérer (get) la valeur d'une propriété ;
  • Setter : Une méthode utilisée pour définir ou mettre à jour la valeur d'une propriété.

Pensez à un coffre-fort de banque. Le coffre contient des objets de valeur (propriétés privées), et le guichetier (getter/setter) agit comme le gardien. Vous ne pouvez pas accéder directement au coffre, mais le guichetier peut récupérer ou mettre à jour des objets pour vous en fonction de certaines règles et validations.

Comment Définir et Utiliser les Getters et Setters

Les getters et setters sont définis à l'aide des mots-clés get et set à l'intérieur d'une classe. Lorsque vous accédez à une propriété, le getter est automatiquement invoqué. De même, lorsque vous modifiez une propriété, le setter est appelé au lieu de modifier directement la propriété.


              
12345678910111213141516171819202122232425262728293031323334

            
class Animal {
  #type; // Private field

  constructor(name, type) {
    this.name = name;
    this.#type = type; // Assigning the private field
  }

  // Getter for the type property
  get type() {
    return this.#type;
  }

  // Setter for the type property
  set type(newType) {
    if (newType) {
      this.#type = newType;
    } else {
      console.log('Invalid type');
    }
  }
}

const lion = new Animal('Lion', 'Wild');

// Using getter to access the private type
console.log(lion.type); // Output: Wild

// Using setter to modify the private type
lion.type = 'Domestic';
console.log(lion.type); // Output: Domestic

// Trying to set an invalid value
lion.type = ''; // Output: Invalid type
copy

Dans cet exemple, #type est une propriété privée, et nous définissons un getter (get type()) pour récupérer sa valeur et un setter (set type(newType)) pour la modifier. Le setter inclut une validation pour empêcher la définition d'une valeur invalide, démontrant comment vous pouvez contrôler les mises à jour des données privées.

Avantages des Getters et Setters

Accès Contrôlé

  • Les getters vous permettent de définir comment la valeur d'une propriété est accédée, vous permettant de traiter ou de manipuler la valeur avant de la retourner ;
  • Les setters vous donnent le contrôle sur la façon dont une propriété est mise à jour, vous permettant de valider ou de transformer les données avant de les attribuer à un champ privé.

Protection des Données

  • L'utilisation de getters et setters aide à protéger l'état interne d'un objet en fournissant une interface contrôlée pour l'interaction ;
  • Les propriétés privées peuvent rester cachées, et vous pouvez exposer uniquement les informations nécessaires au code externe.

Flexibilité

Les getters et setters vous permettent d'ajouter une logique supplémentaire—comme la validation ou la journalisation—lors de l'accès ou de la modification des propriétés sans altérer la façon dont le code externe interagit avec l'objet.

Exemple : Compte Utilisateur avec Validation de Mot de Passe

Imaginez que vous gérez des comptes utilisateurs où les mots de passe doivent répondre à certaines normes de sécurité. En utilisant un setter, vous pouvez imposer la robustesse du mot de passe, tandis qu'un getter pourrait récupérer une version masquée du mot de passe à des fins d'affichage.


              
12345678910111213141516171819202122232425262728293031323334

            
class UserAccount {
  #password; // Private field

  constructor(username, password) {
    this.username = username;
    this.#password = password;
  }

  // Getter for password (returning a masked version)
  get password() {
    return '*'.repeat(this.#password.length); // Mask the password when retrieved
  }

  // Setter for password with validation
  set password(newPassword) {
    if (newPassword.length >= 8) {
      this.#password = newPassword;
    } else {
      console.log('Password must be at least 8 characters long');
    }
  }
}

const user = new UserAccount('nick_feather', 'secret123');

// Accessing the password using the getter (masked)
console.log(user.password); // Output: *********

// Setting a new valid password using the setter
user.password = 'strongPassword123';
console.log(user.password); // Output: ***************

// Trying to set an invalid password
user.password = '123'; // Output: Password must be at least 8 characters long
copy

Dans cet exemple, le getter retourne une version masquée du mot de passe pour cacher la valeur réelle, et le setter impose une validation du mot de passe, garantissant que le mot de passe comporte au moins 8 caractères.

Exemple avec logique de validation utilisant les getters et setters

Voici un autre exemple où nous gérons l'âge d'une personne et nous assurons que la valeur reste dans une plage raisonnable :


              
12345678910111213141516171819202122232425262728293031323334

            
class Person {
  #age; // Private field

  constructor(name, age) {
    this.name = name;
    this.#age = age;
  }

  // Getter for age
  get age() {
    return this.#age;
  }

  // Setter for age with validation
  set age(newAge) {
    if (newAge > 0 && newAge < 120) {
      this.#age = newAge;
    } else {
      console.log('Invalid age');
    }
  }
}

const peter = new Person('Peter', 30);

// Accessing the age using the getter
console.log(peter.age); // Output: 30

// Setting a new valid age using the setter
peter.age = 35;
console.log(peter.age); // Output: 35

// Trying to set an invalid age
peter.age = 150; // Output: Invalid age
copy

Cet exemple démontre comment un setter peut s'assurer qu'un âge reste dans une plage valide, empêchant ainsi le stockage de données invalides.

1. Quel est le but principal de l'utilisation des getters ?

2. Dans le code suivant, que va afficher console.log(user.password); ?

question mark

Quel est le but principal de l'utilisation des getters ?

Select the correct answer

question mark

Dans le code suivant, que va afficher console.log(user.password); ?

Select the correct answer

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 1. Chapitre 9
some-alt