Comment ajouter des propriétés supplémentaires aux tableaux d'objets à l'aide d'une carte JavaScript et d'une répartition d'objets ?

Enrichissement des tableaux d'objets avec des propriétés supplémentaires : ajout de « Actif » à chaque élément

Dans un scénario de programmation réel, vous pouvez rencontrer le besoin d'étendre les tableaux d'objets existants avec des propriétés supplémentaires. Par exemple, considérons un tableau d'objets représentant des données utilisateur, chacun contenant un « identifiant » et un « nom ». Pour suivre leur statut d'activité, vous souhaitez ajouter une propriété « Actif » à chaque objet.

Utiliser Array.prototype.map() pour augmenter les objets

Une approche élégante de ce problème consiste à exploiter la méthode Array.prototype.map(). Cette méthode crée un nouveau tableau en appliquant une fonction de transformation à chaque élément du tableau d'origine. Dans notre cas, nous définissons une fonction qui prend un objet et renvoie un nouvel objet avec une propriété supplémentaire "Active" définie sur "false".

<code class="javascript">const updatedResults = Results.map(obj => ({
  ...obj, // Copy existing properties
  Active: 'false' // Add new "Active" property
}));</code>

En appliquant la méthode map(), vous obtenez un nouveau tableau, "updatedResults", où chaque objet possède la propriété "Active" souhaitée. Le tableau "Résultats" d'origine reste inchangé.

Comprendre la syntaxe de propagation d'objet

La syntaxe "..." dans la fonction est connue sous le nom de syntaxe de propagation d'objet. Il copie toutes les propriétés énumérables d'un objet dans un autre. Dans ce cas, nous l'utilisons pour conserver les propriétés existantes ("id" et "name") tout en ajoutant la nouvelle propriété "Active".

Vérification de sortie

Après avoir exécuté le code ci-dessus, vous pouvez vérifier le tableau "updatedResults" pour confirmer que chaque objet a désormais la propriété "Active" définie sur "false":

<code class="javascript">console.log(updatedResults);
// Output:
// [
//   { id: 1, name: 'Rick', Active: 'false' },
//   { id: 2, name: 'david', Active: 'false' }
// ]</code>

Conclusion

En utilisant Array.prototype.map( ) et la syntaxe de répartition d'objets, vous pouvez facilement améliorer les tableaux d'objets avec des propriétés supplémentaires. Cette technique est largement applicable dans divers scénarios de programmation où vous devez étendre et manipuler des structures de données de manière dynamique.

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!