Apprendre Utilisation des Propriétés dans les Méthodes

Approfondissement de l'utilisation des méthodes d'objet et exploration de la manière dont les méthodes utilisent le mot-clé this pour accéder aux propriétés de l'objet.

Accès aux propriétés d'objet dans les méthodes

Lorsqu'une méthode est définie au sein d'un objet, il est possible d'accéder aux propriétés de cet objet à l'aide du mot-clé this. this fait référence à l'objet qui appelle la méthode, permettant ainsi d'interagir avec ses propriétés. Illustration de ce concept par un exemple :

const furniture = {
  type: "wardrobe",
  manufacturer: "Belgium",
  color: "wenge magic",
  getInfo() {
    console.log(this);
  },
};

// Method call
furniture.getInfo(); // Output: {type: 'wardrobe', manufacturer: 'Belgium', color: 'wenge magic', getInfo: ƒ}

Dans la méthode getInfo, this fait référence à l'objet furniture et représente l'ensemble du contenu interne de l'objet.

Exemple pratique

Dans les méthodes, il est possible d'accéder aux propriétés de l'objet via this puis d'utiliser la notation par point pour accéder aux propriétés spécifiques comme d'habitude.

Dans l'exemple ci-dessous, les méthodes getColor, addProperty et modifyProperty utilisent this pour accéder à la propriété furniture et effectuer diverses opérations.

getColor affiche la couleur de l'armoire dans la console en utilisant this pour référencer les propriétés de l'objet ;
addProperty ajoute de nouvelles propriétés à l'objet furniture. Elle prend deux paramètres : propertyName (le nom de la nouvelle propriété) et propertyValue (la valeur à attribuer à la nouvelle propriété) ;
modifyProperty modifie la valeur d'une propriété existante dans l'objet furniture. Elle prend deux paramètres : propertyName (le nom de la propriété à modifier) et propertyValue (la nouvelle valeur à attribuer à la propriété).


              12345678910111213141516171819202122232425262728
            
const furniture = {
  type: "wardrobe",
  manufacturer: "Belgium",
  color: "wenge magic",

  getColor() {
    console.log(this.color);
  },

  addProperty(propertyName, propertyValue) {
    this[propertyName] = propertyValue;
  },

  modifyProperty(propertyName, propertyValue) {
    this[propertyName] = propertyValue;
  },
};

// Access the `color` property of the `furniture` and log it to the console.
furniture.getColor(); // Output: wenge magic

// Add a new property to the `furniture` object using the `addProperty` method.
furniture.addProperty("material", "wood");
console.log(furniture.material); // Output: wood

// Modify an existing property using the `modifyProperty` method.
furniture.modifyProperty("color", "oak");
console.log(furniture.color); // Output: oak

Remarque

L'utilisation du mot-clé this est essentielle dans les méthodes d'objet. Il garantit que la méthode fonctionne avec l'objet spécifique qui l'appelle, même si le nom est inconnu à l'avance. Cela permet d'éviter des problèmes potentiels, tels que la copie de méthodes d'un objet à un autre avec un nom différent.

Tout était clair ?

Merci pour vos commentaires !

Section 2. Chapitre 10

Demandez à l'IA

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

Suggested prompts:

Can you explain more about how the `this` keyword works in different contexts?

What happens if I call a method without using the object (e.g., assign it to a variable and call it)?

Can you show an example of copying a method to another object and how `this` behaves?

Awesome!

Completion rate improved to 2.27

Glissez pour afficher le menu

Approfondissement de l'utilisation des méthodes d'objet et exploration de la manière dont les méthodes utilisent le mot-clé this pour accéder aux propriétés de l'objet.

Accès aux propriétés d'objet dans les méthodes

const furniture = {
  type: "wardrobe",
  manufacturer: "Belgium",
  color: "wenge magic",
  getInfo() {
    console.log(this);
  },
};

// Method call
furniture.getInfo(); // Output: {type: 'wardrobe', manufacturer: 'Belgium', color: 'wenge magic', getInfo: ƒ}

Dans la méthode getInfo, this fait référence à l'objet furniture et représente l'ensemble du contenu interne de l'objet.

Exemple pratique

Dans les méthodes, il est possible d'accéder aux propriétés de l'objet via this puis d'utiliser la notation par point pour accéder aux propriétés spécifiques comme d'habitude.

Dans l'exemple ci-dessous, les méthodes getColor, addProperty et modifyProperty utilisent this pour accéder à la propriété furniture et effectuer diverses opérations.

getColor affiche la couleur de l'armoire dans la console en utilisant this pour référencer les propriétés de l'objet ;
addProperty ajoute de nouvelles propriétés à l'objet furniture. Elle prend deux paramètres : propertyName (le nom de la nouvelle propriété) et propertyValue (la valeur à attribuer à la nouvelle propriété) ;
modifyProperty modifie la valeur d'une propriété existante dans l'objet furniture. Elle prend deux paramètres : propertyName (le nom de la propriété à modifier) et propertyValue (la nouvelle valeur à attribuer à la propriété).


              12345678910111213141516171819202122232425262728
            
const furniture = {
  type: "wardrobe",
  manufacturer: "Belgium",
  color: "wenge magic",

  getColor() {
    console.log(this.color);
  },

  addProperty(propertyName, propertyValue) {
    this[propertyName] = propertyValue;
  },

  modifyProperty(propertyName, propertyValue) {
    this[propertyName] = propertyValue;
  },
};

// Access the `color` property of the `furniture` and log it to the console.
furniture.getColor(); // Output: wenge magic

// Add a new property to the `furniture` object using the `addProperty` method.
furniture.addProperty("material", "wood");
console.log(furniture.material); // Output: wood

// Modify an existing property using the `modifyProperty` method.
furniture.modifyProperty("color", "oak");
console.log(furniture.color); // Output: oak

Remarque

L'utilisation du mot-clé this est essentielle dans les méthodes d'objet. Il garantit que la méthode fonctionne avec l'objet spécifique qui l'appelle, même si le nom est inconnu à l'avance. Cela permet d'éviter des problèmes potentiels, tels que la copie de méthodes d'un objet à un autre avec un nom différent.

Tout était clair ?

Merci pour vos commentaires !

Section 2. Chapitre 10

Utilisation des Propriétés dans les Méthodes

Accès aux propriétés d'objet dans les méthodes

Exemple pratique

1. À quoi fait référence le mot-clé `this` lorsqu'il est utilisé dans une méthode d'un objet ?

2. Dans l'exemple fourni ci-dessous, quel est le rôle de la méthode `getFeastPrice` dans l'objet `menu` ?

3. Dans l'exemple fourni ci-dessous, comment accéder à la propriété « cold appetizer » de l'objet `menu` en utilisant `this` ?

Awesome!

Utilisation des Propriétés dans les Méthodes

Accès aux propriétés d'objet dans les méthodes

Exemple pratique

1. À quoi fait référence le mot-clé `this` lorsqu'il est utilisé dans une méthode d'un objet ?

2. Dans l'exemple fourni ci-dessous, quel est le rôle de la méthode `getFeastPrice` dans l'objet `menu` ?

3. Dans l'exemple fourni ci-dessous, comment accéder à la propriété « cold appetizer » de l'objet `menu` en utilisant `this` ?

Utilisation des Propriétés dans les Méthodes

Accès aux propriétés d'objet dans les méthodes

Exemple pratique

1. À quoi fait référence le mot-clé this lorsqu'il est utilisé dans une méthode d'un objet ?

2. Dans l'exemple fourni ci-dessous, quel est le rôle de la méthode getFeastPrice dans l'objet menu ?

3. Dans l'exemple fourni ci-dessous, comment accéder à la propriété « cold appetizer » de l'objet menu en utilisant this ?

Awesome!

Utilisation des Propriétés dans les Méthodes

Accès aux propriétés d'objet dans les méthodes

Exemple pratique

1. À quoi fait référence le mot-clé this lorsqu'il est utilisé dans une méthode d'un objet ?

2. Dans l'exemple fourni ci-dessous, quel est le rôle de la méthode getFeastPrice dans l'objet menu ?

3. Dans l'exemple fourni ci-dessous, comment accéder à la propriété « cold appetizer » de l'objet menu en utilisant this ?

1. À quoi fait référence le mot-clé `this` lorsqu'il est utilisé dans une méthode d'un objet ?

2. Dans l'exemple fourni ci-dessous, quel est le rôle de la méthode `getFeastPrice` dans l'objet `menu` ?

3. Dans l'exemple fourni ci-dessous, comment accéder à la propriété « cold appetizer » de l'objet `menu` en utilisant `this` ?

1. À quoi fait référence le mot-clé `this` lorsqu'il est utilisé dans une méthode d'un objet ?

2. Dans l'exemple fourni ci-dessous, quel est le rôle de la méthode `getFeastPrice` dans l'objet `menu` ?

3. Dans l'exemple fourni ci-dessous, comment accéder à la propriété « cold appetizer » de l'objet `menu` en utilisant `this` ?