Maison > interface Web > js tutoriel > JavaScript : Comment supprimer la paire clé-valeur correspondant à une clé donnée d'un objet ?

JavaScript : Comment supprimer la paire clé-valeur correspondant à une clé donnée d'un objet ?

PHPz
Libérer: 2023-08-22 15:53:12
avant
3298 Les gens l'ont consulté

JavaScript : Comment supprimer la paire clé-valeur correspondant à une clé donnée dun objet ?

En JavaScript, des objets peuvent être créés pour stocker des données, sous la forme de paires clé-valeur. Les données d'un objet sont accessibles en utilisant la notation par points (obj.key) ou la notation entre crochets (obj["key"]). Veuillez vous référer à l'exemple ci-dessous −

let obj = { key1: "value1", key2: "value2", key3: "value" };
Copier après la connexion
Nous pouvons supprimer les paires clé-valeur correspondant aux clés données de l'objet, mais avant de supprimer, nous devons nous assurer que ces clés existent dans l'objet Dans ce tutoriel, nous présenterons 3 méthodes.

Utilisation de l'opérateur delete

L'opérateur delete est utilisé pour supprimer les attributs d'un objet. L'opérateur delete ne supprime pas la variable elle-même, mais uniquement sa valeur.

Exemple

Veuillez vous référer à l'exemple ci-dessous -

<!doctype html>
<html>
<head>
   <title>Examples</title>
</head>
<body>
   <div id="result"></div>
   <script>
      let obj = { key1: "value1", key2: "value2", key3: "value3" };
      delete obj.key2;
      document.getElementById("result").innerHTML = JSON.stringify(obj);
      console.log(obj)
   </script>
</body>
</html>
Copier après la connexion

Comme vous pouvez le voir dans l'exemple ci-dessus, l'opérateur de suppression supprime uniquement la valeur

clé et non la clé elle-même.

Vous trouverez ci-dessous l'explication ligne par ligne du code ci-dessus −

clé et non la clé elle-même.

Ce qui suit est une explication ligne par ligne du code ci-dessus −

let obj = { key1: "value1", key2: "value2", key3: "value3" };
Copier après la connexion
Copier après la connexion

Nous avons créé un objet contenant 3 paires clé-valeur. L'opérateur

delete obj.key2;
Copier après la connexion

delete est utilisé pour supprimer une paire clé-valeur, où la clé est "key2".

console.log(obj);
Copier après la connexion
Copier après la connexion

La sortie du code ci-dessus sur la console sera : { key1 : "value1", key3 : "value3" } Vous pouvez voir que la paire clé-valeur avec la clé "key2" a été supprimée de l'objet.

Utilisation de la méthode filter()

La méthode filter() est utilisée pour créer un nouveau tableau à partir d'un tableau existant. Voir l'exemple ci-dessous :

Exemple




   Examples

<script> let obj = { key1: &quot;value1&quot;, key2: &quot;value2&quot;, key3: &quot;value3&quot; }; let newObj = Object.keys(obj) .filter(key => key != "key2") .reduce((acc, key) => { acc[key] = obj[key]; return acc; }, {}); document.getElementById("result").innerHTML = JSON.stringify(newObj); console.log(newObj) </script>
Copier après la connexion

Comme vous pouvez le voir dans l'exemple ci-dessus, la méthode filter() supprime uniquement le la clé et non la clé elle-même.

Vous trouverez ci-dessous l'explication ligne par ligne du code ci-dessus :

La clé est la clé elle-même.

Ce qui suit est une explication ligne par ligne du code ci-dessus :

let obj = { key1: "value1", key2: "value2", key3: "value3" };
Copier après la connexion
Copier après la connexion

Nous avons créé un objet contenant 3 paires clé-valeur. La méthode

let newObj = Object.keys(obj)
.filter(key => key != "key2")
.reduce((acc, key) => {
   acc[key] = obj[key];
   return acc;
}, {});
Copier après la connexion

Object.keys() est utilisée pour créer un tableau contenant des clés d'objet La méthode filter() est utilisée pour créer un nouveau tableau à partir d’un tableau existant. La clé est Comparez avec "key2". S'il n'est pas égal, ajoutez la paire clé-valeur à un nouveau tableau La méthode réduire() est utilisée pour réduire un tableau en objet.

console.log(newObj);
Copier après la connexion
Le résultat du code ci-dessus sera :

{ key1 : "value1", key3 : "value3" }

. Comme vous pouvez le voir, La paire clé-valeur supprimée avec la clé « key2 » a été supprimée de l'objet.

Utiliser for…in loop

for…inloop est utilisé pour parcourir les propriétés d'un objet.

Exemple

Veuillez vous référer à l'exemple suivant −




   Examples

<script> let obj = { key1: &quot;value1&quot;, key2: &quot;value2&quot;, key3: &quot;value3&quot; }; for (let key in obj) { if (key == "key2") { delete obj[key]; } } document.getElementById("result").innerHTML = JSON.stringify(obj); console.log(obj) </script>
Copier après la connexion

Comme vous pouvez le voir dans l'exemple ci-dessus, la boucle for…in supprime uniquement la valeur de la clé et non la clé elle-même.

Explication ci-dessous ligne par ligne du code ci-dessus :

Pas la clé elle-même.

Ce qui suit est une explication ligne par ligne du code ci-dessus :

let obj = {key1: "value1", key2: "value2", key3: "value3"};
Copier après la connexion

Nous avons créé un objet contenant 3 paires clé-valeur.

for (let key in obj) {
   if (key == "key2") {
      delete obj[key];
   }
}
Copier après la connexion

Utilisez une boucle for…in pour parcourir les propriétés d'un objet. La variable key est utilisée pour stocker la clé de l'objet. Si la clé est "key2", supprimez la paire clé-valeur de l'objet.

console.log(obj);
Copier après la connexion
Copier après la connexion
Le résultat du code ci-dessus sera :

{ key1 : "value1", key3 : "value3" }

. Comme vous pouvez le voir, La paire clé-valeur supprimée avec le nom de clé « key2 » a été supprimée de l'objet.

Conclusion

Dans ce tutoriel, nous avons présenté 3 façons de supprimer les paires clé-valeur correspondant aux paires clé-valeur Étant donné la clé d'un objet. Opérateur de suppression, boucle for...in et méthode filter().

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:tutorialspoint.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal