Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Apprendre Défi : Gestion des Propriétés avec Getters et Setters | Classes
Maîtrise Avancée de JavaScript
course content

Contenu du cours

Maîtrise Avancée de JavaScript

Maîtrise Avancée de JavaScript

1. Classes
Bienvenue dans le CoursDéclaration de ClasseDéfi : Construire une ClasseMéthodes de ClasseDéfi : Ajouter des Méthodes à une ClasseObjet ParamètrePropriétés PrivéesDéfi : Implémentation de Propriétés Privées dans une ClasseAccesseurs et MutateursDéfi : Gestion des Propriétés avec Getters et SettersPropriétés StatiquesMéthodes StatiquesDéfi : Utilisation des Propriétés et Méthodes Statiques dans une ClasseHéritage avec Extends et Utilisation de super()Défi : Héritage de Classe avec Extends et Utilisation de Super
2. Manipulation du DOM
Qu'est-ce Que le DOM?Interroger le DOMDéfi : Interroger le DOMComprendre la Hiérarchie du DOMDéfi : Hiérarchie DOMPropriétés Du DOMTravailler Avec les Attributs des ÉlémentsDéfi : Travailler Avec les Propriétés et Attributs des ÉlémentsAjouter des ÉlémentsSuppression des ÉlémentsDéfi : Ajouter et Supprimer des ÉlémentsModifier les Styles des ÉlémentsDéfi : Modifier les Styles des Éléments
3. Événements et Gestion des Événements
Introduction aux Événements et aux Écouteurs d'ÉvénementsL'Objet ÉvénementDéfi : Événements et Écouteurs d'ÉvénementsPropagation et Délégation d'ÉvénementsDéfi : Propagation et Délégation d'ÉvénementsÉvénements Clavier et SourisGestion des Écouteurs d'Événements
4. JavaScript Asynchrone et APIs
Introduction à JavaScript AsynchroneRappelsPromessesAsync/AwaitTravailler Avec les APIsIntégration Pratique de l'APIDéfi : Travailler Avec l'APITravailler avec des Bibliothèques TiercesDéfi : Travailler Avec des Bibliothèques TiercesGestion de Plusieurs Requêtes Asynchrones

book
Défi : Gestion des Propriétés avec Getters et Setters

Tâche

Vous travaillez au sein d'une classe Car qui possède une propriété privée #mileage. Votre tâche est de définir des getters et setters pour cette propriété afin de contrôler comment elle est accédée et modifiée.

  1. Définir un Getter pour le Kilométrage : Définissez un getter pour la propriété mileage afin de récupérer le kilométrage actuel ;
  2. Définir un Setter pour le Kilométrage avec Validation : Définissez un setter pour la propriété mileage qui accepte une nouvelle valeur de kilométrage. Ce setter doit :
    • Permettre la mise à jour uniquement si le nouveau kilométrage est supérieur au kilométrage actuel (le kilométrage ne peut qu'augmenter) ;
    • Si le nouveau kilométrage est invalide, enregistrer "Invalid mileage update" et ne pas changer le kilométrage actuel.

              
123456789101112131415161718192021222324252627

            
class Car {
  #mileage = 1000; // Initial private mileage

  // Getter for mileage
  _____ mileage() {
    return this.#_____;
  }

  // Setter for mileage with validation
  _____ mileage(newMileage) {
    _____ (_____ > this.#_____) {
      this.#_____ = newMileage;
    } _____ {
      console.log(_____);
    }
  }
}

// Testing
const car1 = new Car();

console.log(car1.mileage); // Expected: 1000

car1.mileage = 1500; // Update mileage to 1500
console.log(car1.mileage); // Expected: 1500

car1.mileage = 900; // Attempt invalid mileage update, expected: Invalid mileage update
copy
  • Définir un accessoire get pour mileage afin de récupérer le kilométrage actuel ;
  • Définir un accessoire set pour mileage qui prend newMileage comme paramètre ;
  • Dans le setter, vérifier si newMileage est supérieur au kilométrage actuel (this.#mileage) ;
  • Si newMileage est valide, mettre à jour #mileage à newMileage ;
  • Si newMileage n'est pas supérieur au kilométrage actuel, enregistrer "Invalid mileage update" et ne pas changer le kilométrage.

              
123456789101112131415161718192021222324252627

            
class Car {
  #mileage = 1000; // Initial private mileage

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

  // Setter for mileage with validation
  set mileage(newMileage) {
    if (newMileage > this.#mileage) {
      this.#mileage = newMileage;
    } else {
      console.log('Invalid mileage update');
    }
  }
}

// Testing
const car1 = new Car();

console.log(car1.mileage); // Output: 1000

car1.mileage = 1500; // Update mileage to 1500
console.log(car1.mileage); // Output: 1500

car1.mileage = 900; // Attempt invalid mileage update, expected: Invalid mileage update
copy

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 1. Chapitre 10

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

course content

Contenu du cours

Maîtrise Avancée de JavaScript

Maîtrise Avancée de JavaScript

1. Classes
Bienvenue dans le CoursDéclaration de ClasseDéfi : Construire une ClasseMéthodes de ClasseDéfi : Ajouter des Méthodes à une ClasseObjet ParamètrePropriétés PrivéesDéfi : Implémentation de Propriétés Privées dans une ClasseAccesseurs et MutateursDéfi : Gestion des Propriétés avec Getters et SettersPropriétés StatiquesMéthodes StatiquesDéfi : Utilisation des Propriétés et Méthodes Statiques dans une ClasseHéritage avec Extends et Utilisation de super()Défi : Héritage de Classe avec Extends et Utilisation de Super
2. Manipulation du DOM
Qu'est-ce Que le DOM?Interroger le DOMDéfi : Interroger le DOMComprendre la Hiérarchie du DOMDéfi : Hiérarchie DOMPropriétés Du DOMTravailler Avec les Attributs des ÉlémentsDéfi : Travailler Avec les Propriétés et Attributs des ÉlémentsAjouter des ÉlémentsSuppression des ÉlémentsDéfi : Ajouter et Supprimer des ÉlémentsModifier les Styles des ÉlémentsDéfi : Modifier les Styles des Éléments
3. Événements et Gestion des Événements
Introduction aux Événements et aux Écouteurs d'ÉvénementsL'Objet ÉvénementDéfi : Événements et Écouteurs d'ÉvénementsPropagation et Délégation d'ÉvénementsDéfi : Propagation et Délégation d'ÉvénementsÉvénements Clavier et SourisGestion des Écouteurs d'Événements
4. JavaScript Asynchrone et APIs
Introduction à JavaScript AsynchroneRappelsPromessesAsync/AwaitTravailler Avec les APIsIntégration Pratique de l'APIDéfi : Travailler Avec l'APITravailler avec des Bibliothèques TiercesDéfi : Travailler Avec des Bibliothèques TiercesGestion de Plusieurs Requêtes Asynchrones

book
Défi : Gestion des Propriétés avec Getters et Setters

Tâche

Vous travaillez au sein d'une classe Car qui possède une propriété privée #mileage. Votre tâche est de définir des getters et setters pour cette propriété afin de contrôler comment elle est accédée et modifiée.

  1. Définir un Getter pour le Kilométrage : Définissez un getter pour la propriété mileage afin de récupérer le kilométrage actuel ;
  2. Définir un Setter pour le Kilométrage avec Validation : Définissez un setter pour la propriété mileage qui accepte une nouvelle valeur de kilométrage. Ce setter doit :
    • Permettre la mise à jour uniquement si le nouveau kilométrage est supérieur au kilométrage actuel (le kilométrage ne peut qu'augmenter) ;
    • Si le nouveau kilométrage est invalide, enregistrer "Invalid mileage update" et ne pas changer le kilométrage actuel.

              
123456789101112131415161718192021222324252627

            
class Car {
  #mileage = 1000; // Initial private mileage

  // Getter for mileage
  _____ mileage() {
    return this.#_____;
  }

  // Setter for mileage with validation
  _____ mileage(newMileage) {
    _____ (_____ > this.#_____) {
      this.#_____ = newMileage;
    } _____ {
      console.log(_____);
    }
  }
}

// Testing
const car1 = new Car();

console.log(car1.mileage); // Expected: 1000

car1.mileage = 1500; // Update mileage to 1500
console.log(car1.mileage); // Expected: 1500

car1.mileage = 900; // Attempt invalid mileage update, expected: Invalid mileage update
copy
  • Définir un accessoire get pour mileage afin de récupérer le kilométrage actuel ;
  • Définir un accessoire set pour mileage qui prend newMileage comme paramètre ;
  • Dans le setter, vérifier si newMileage est supérieur au kilométrage actuel (this.#mileage) ;
  • Si newMileage est valide, mettre à jour #mileage à newMileage ;
  • Si newMileage n'est pas supérieur au kilométrage actuel, enregistrer "Invalid mileage update" et ne pas changer le kilométrage.

              
123456789101112131415161718192021222324252627

            
class Car {
  #mileage = 1000; // Initial private mileage

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

  // Setter for mileage with validation
  set mileage(newMileage) {
    if (newMileage > this.#mileage) {
      this.#mileage = newMileage;
    } else {
      console.log('Invalid mileage update');
    }
  }
}

// Testing
const car1 = new Car();

console.log(car1.mileage); // Output: 1000

car1.mileage = 1500; // Update mileage to 1500
console.log(car1.mileage); // Output: 1500

car1.mileage = 900; // Attempt invalid mileage update, expected: Invalid mileage update
copy

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 1. Chapitre 10
some-alt