Méthodes avancées du tableau JavaScript pour la transformation des données

Des méthodes de tableau JavaScript telles que la carte, le filtre et la réduction peuvent simplifier efficacement le traitement des données. 1. La carte est utilisée pour convertir les éléments du tableau et renvoyer un nouveau tableau, tel que l'extraction des champs ou le format de modification; 2. Le filtre est utilisé pour filtrer les éléments qui remplissent les conditions et renvoient un nouveau tableau, adapté pour filtrer les valeurs non valides ou des données conditionnelles spécifiques; 3. Réduction est utilisée pour les opérations d'agrégation, telles que la sommation ou les statistiques, faire attention à la définition de la valeur initiale et à un retour correctement à l'accumulateur. Ces méthodes ne modifient pas le tableau d'origine, les appels de la chaîne de support et améliorent la lisibilité et la maintenance du code.

Lors du traitement des données, la méthode du tableau de JavaScript peut vous éviter beaucoup de problèmes. En particulier, certaines méthodes avancées, telles que map , filter et reduce , sont utilisées presque tous les jours. Ils rendent non seulement votre code plus concis, mais améliorent également la lisibilité et la maintenance.

Utiliser la carte pour la cartographie des données

map est l'un des outils de conversion les plus couramment utilisés. Sa fonction est de "modifier chaque élément dans un tableau", puis de renvoyer un nouveau tableau. Par exemple, si vous avez un ensemble de données brutes et que vous souhaitez en extraire certains champs ou convertir les formats, map est très appropriée.

Par exemple, vous avez une liste d'utilisateurs:

 const users = [
  {id: 1, nom: 'Alice', e-mail: 'Alice@example.com'},
  {id: 2, nom: 'bob', e-mail: 'bob@example.com'}
]]

Si vous souhaitez générer un tableau qui ne contient que des noms, vous pouvez l'écrire comme ceci:

 const names = users.map (user => user.name);
// ['Alice', 'Bob']

Vous pouvez également traiter les données pendant la cartographie, comme la conversion du nom en capital:

 const uppernames = users.map (user => user.name.touppercase ());

Le point clé est: MAP ne modifiera pas le tableau d'origine, mais renverra un nouveau tableau . Vous pouvez donc vous sentir à l'aise avec les appels de chaîne et ne vous inquiétez pas des effets secondaires.

filtre filtre les données dont vous avez besoin

Si vous souhaitez simplement conserver des données qui répondent à une certaine condition, filter est utile. Il iratera sur chaque élément du tableau et décidera de conserver l'élément en fonction de la valeur de retour de la fonction de rappel (true ou false).

Supposons que vous souhaitiez trouver tous les utilisateurs dont la longueur du nom est supérieure à 3:

 const longNames = users.filter (user => user.name.length> 3);

Il peut également être utilisé pour déduir ou exclure des valeurs spécifiques. Par exemple, filtrez les valeurs vides:

 Const valeurs = [0, 1, null, 2, non défini, 3];
const CleanValues = valeurs.filter (boolean); // [1, 2, 3]

Faites attention lorsque vous utilisez filter :

• La fonction de rappel doit renvoyer une valeur booléenne
• Le retour est le nouveau tableau, le tableau d'origine reste inchangé
• Peut être utilisé conjointement avec map , filtrez d'abord puis convertir

réduire la logique d'agrégation complexe de poignées

Si map et filter sont des opérations de base, reduce est une arme avancée. Il peut "classer" un tableau en valeur, tel que la somme, la moyenne, le groupe d'objets, etc.

Par exemple, calculez le prix total de la commande:

 const Orders = [
  {total: 100},
  {total: 200},
  {total: 300}
]]

const totalamount = orders.reduce ((sum, ordre) => sum order.total, 0);

Vous pouvez également utiliser reduce pour compter les événements:

 const fruits = [«pomme», «banane», «pomme», «orange»];
const Count = fruits.reduce ((acc, fruit) => {
  Acc [fruit] = (acc [fruit] || 0) 1;
  Retour ACC;
}, {});
// {Apple: 2, banane: 1, orange: 1}

La clé pour réduire est de comprendre la valeur initiale et le rôle de l'accumulateur. Les erreurs courantes comprennent:

• Oublié de définir la valeur initiale, résultant en des types incohérents
• Pas d'accumulateur de retour
• Dans des scénarios simples, il peut en fait s'exprimer plus clairement en utilisant la carte / filtre

Fondamentalement, c'est tout. Ces méthodes peuvent gérer la plupart des tâches de traitement des données ensemble. Bien que cela ne semble pas difficile, après avoir vraiment maîtrisé les détails, vous constaterez que l'écriture de code est beaucoup plus fluide.

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!