Maison  >  Article  >  interface Web  >  JavaScript remplace la clé de l'objet

JavaScript remplace la clé de l'objet

PHPz
PHPzoriginal
2023-05-09 18:27:083964parcourir

En programmation JavaScript, faire fonctionner des objets est une exigence très courante. Il est souvent nécessaire de changer le nom de certaines clés d'un objet. Bien que JavaScript offre de nombreuses façons différentes de manipuler des objets, remplacer la clé d'un objet par une nouvelle clé peut s'avérer difficile.

Dans cet article, nous explorerons différentes manières de remplacer les clés d'un objet par de nouvelles clés en JavaScript. Nous aborderons les aspects suivants :

  1. Qu'est-ce que le remplacement de clé d'objet
  2. Comment effectuer le remplacement de clé d'objet en JavaScript
  3. Utiliser ES6 Utilisez la méthode Object.assign() pour remplacer les clés
  4. Utilisez la méthode de déstructuration d'objet d'ES6 pour remplacer les clés
  5. Utilisez les méthodes Object.entries() et Object.fromEntries() Key remplacement

Qu'est-ce que le remplacement de clé d'objet

Le remplacement de clé d'objet est une opération qui nous permet de changer le nom d'une clé spécifique dans un objet JavaScript. Ceci est utile lorsque vous avez besoin d’obtenir une valeur à partir d’un objet. Par exemple, lors de la récupération de données d'objet via une API, vous devrez peut-être faire correspondre les clés de l'objet de données renvoyé avec les clés utilisées dans le magasin de données local.

Comment remplacer les clés d'objet en JavaScript

Il existe de nombreuses façons différentes de remplacer les clés d'objet en JavaScript. Les trois méthodes les plus couramment utilisées sont décrites ci-dessous.

  1. Vous pouvez modifier la clé d'un objet en spécifiant le nom de la propriété de l'objet. Par exemple :
const obj = { oldName: "value" };
obj.newName = obj.oldName;
delete obj.oldName;

Dans l'extrait de code ci-dessus, nous implémentons le remplacement de clé d'objet en créant un nouveau nom de clé, en copiant la valeur de l'ancien nom de clé, puis en supprimant l'ancien nom de clé. .

  1. En utilisant Object.keys(), vous pouvez obtenir la liste des clés de l'objet et utiliser une boucle forEach() pour parcourir chaque clé et utiliser l'opérateur de suppression pour supprimer l'ancienne clé, puis utiliser New key copie l'ancienne valeur de clé dans la nouvelle clé. Par exemple :
const obj = { oldName: "value" };
Object
  .keys(obj)
  .forEach(key => {
    if (key === "oldName") {
      obj.newName = obj[key];
      delete obj[key];
    }
  });

Utilisez Object.keys() localement pour obtenir les clés de l'objet, puis utilisez une instruction if pour vérifier si chaque clé correspond au nom que vous souhaitez modifier. S'il y a une correspondance, la valeur est copiée dans la nouvelle clé et l'ancienne clé est supprimée.

  1. Utilisez la méthode Object.assign() pour copier la nouvelle valeur de clé et l'ancienne valeur de clé dans le nouvel objet, puis supprimez l'ancienne clé. Par exemple :
const obj = { oldName: "value" };
const newObj = {};
newObj.newName = obj.oldName;
delete newObj.oldName;

Utilisez la méthode Object.assign() d'ES6 pour le remplacement de clé

En utilisant la méthode Object.assign() d'ES6 et ses paramètres disponibles, nous pouvons gérer la tâche de remplacement de la clé d'objet JavaScript. Object.assign() est une méthode qui copie l'objet source dans l'objet cible et renvoie l'objet cible. Par conséquent, nous pouvons envoyer l’objet source avec la nouvelle clé comme paramètres pour implémenter le remplacement.

const obj = { oldName: "value" };
const newObj = Object.assign({}, obj, {newName: obj.oldName});
delete newObj.oldName;

Ici, nous utilisons Object.assign() pour créer un nouvel objet et utiliser l'ancien objet et ses propriétés comme objet source. Ensuite, en utilisant le nouveau nom de clé comme argument distinct, exprimez ce nom comme correspondant au nom de l'ancienne clé que vous souhaitez supprimer. Enfin, le remplacement de la clé est complété par la suppression de l'ancienne clé.

Utilisez la méthode de déstructuration d'objets d'ES6 pour remplacer les clés

La déstructuration d'objets dans ES6 offre une autre façon de remplacer les clés d'objet JavaScript. La déstructuration d'objets est une méthode de déstructuration des propriétés d'un objet en variables distinctes, qui peuvent avoir de nouveaux noms (variables d'alias). En utilisant la nouvelle clé comme alias, nous pouvons générer l'opération de remplacement de clé souhaitée en supprimant l'ancienne clé.

const obj = { oldName: "value" };
const {oldName:newName, ...newObj} = obj;

Ici, nous déclarons un nouvel objet et déplaçons toutes les propriétés de l'objet opéré vers le nouvel objet par affectation de déstructuration. Nous alias les anciennes clés sur le nouvel objet en utilisant "…" (opérateur spread). De cette façon, la syntaxe de déstructuration nous permet en fait de donner à notre objet cible un nouveau nom pour n'importe quelle clé cible (appelée alias).

Utilisez les méthodes Object.entries() et Object.fromEntries() pour le remplacement des clés

Object.entries() et Object.fromEntries() sont les dernières technologies, dans Introduit en ES2019. Ces méthodes simplifient grandement le remplacement de la clé d'objet.

const obj = { oldName: "value" };
const newObj = Object.fromEntries(
  Object.entries(obj)
    .map(([k, v]) => [k === "oldName" ? "newName" : k, v])
);

Ici, nous utilisons la méthode Object.entries() pour obtenir la liste des paires clé-valeur de l'objet. Nous transformons cette liste à l'aide de la méthode map(), en remplaçant les anciennes clés par de nouvelles clés si elles correspondent, puis en ajoutant chaque nouvelle paire clé-valeur à un nouvel objet. Convertissez la liste d'éléments convertie en un nouvel objet paire clé-valeur à l'aide de la méthode Object.fromEntries().

Conclusion

Le remplacement de clé d'objet est très courant pour travailler avec des données d'objet JavaScript. Nous voyons que JavaScript propose de nombreuses façons différentes d'y parvenir via le remplacement de clé d'objet JavaScript. Il est facile de supprimer et de renommer des clés dans des objets JavaScript à l'aide des méthodes ES6 standard. Pour cela nous pouvons utiliser la méthode Object.assign(), la déstructuration d'objets, les méthodes Object.keys() et Object.entries(). Ces stratégies recherchent toutes des performances, une facilité d'utilisation et une lisibilité maximales.

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!

Déclaration:
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