Maîtriser les méthodes de tableau en JavaScript : mapper, filtrer et réduire

Méthodes de tableau en JavaScript : mapper, filtrer et réduire

JavaScript fournit des méthodes de tableau puissantes qui simplifient les opérations sur les tableaux. Parmi celles-ci, mapper, filtrer et réduire sont trois fonctions essentielles d'ordre supérieur que tout développeur doit comprendre.

1. La méthode cartographique

La méthode map crée un nouveau tableau en transformant chaque élément d'un tableau existant à l'aide d'une fonction de rappel.

Syntaxe

array.map(callback(currentValue[, index[, array]])[, thisArg]);

Exemple : Transformer des éléments

const numbers = [1, 2, 3, 4];
const squared = numbers.map(function(number) {
  return number * number;
});
console.log(squared); // Output: [1, 4, 9, 16]

Cas d'utilisation

• Application de transformations aux tableaux (par exemple, conversion d'unités, formatage des données).

2. La méthode de filtrage

La méthode filter crée un nouveau tableau contenant uniquement les éléments qui réussissent un test implémenté par la fonction de rappel fournie.

Syntaxe

array.filter(callback(element[, index[, array]])[, thisArg]);

Exemple : éléments de filtrage

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(function(number) {
  return number % 2 === 0;
});
console.log(evenNumbers); // Output: [2, 4]

Cas d'utilisation

• Filtrage des tableaux en fonction de conditions spécifiques (par exemple, filtrage des valeurs nulles, recherche d'utilisateurs actifs).

3. La méthode réduire

La méthode de réduction applique une fonction à un accumulateur et à chaque élément du tableau (de gauche à droite), en le réduisant à une seule valeur.

Syntaxe

array.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue]);

Exemple : additionner les éléments d'un tableau

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce(function(accumulator, currentValue) {
  return accumulator + currentValue;
}, 0);
console.log(sum); // Output: 10

Cas d'utilisation

• Calcul des totaux (par exemple, sommes, moyennes).
• Aplatissement des tableaux imbriqués.

4. Combiner cartographie, filtre et réduction

Ces méthodes peuvent être combinées pour effectuer des opérations complexes.

Exemple : Total des nombres pairs au carré

const numbers = [1, 2, 3, 4, 5];

const total = numbers
  .filter(function(number) {
    return number % 2 === 0; // Keep even numbers
  })
  .map(function(number) {
    return number * number; // Square the numbers
  })
  .reduce(function(accumulator, currentValue) {
    return accumulator + currentValue; // Sum the squares
  }, 0);

console.log(total); // Output: 20

5. Différences clés

6. Avantages de l'utilisation de ces méthodes

1. Lisibilité : Code plus propre et plus déclaratif.
2. Réutilisabilité : Modularisez les opérations sur les tableaux.
3. Performance : Simplifiez les opérations courantes avec des méthodes optimisées.

7. Résumé

• map transforme un tableau en appliquant une fonction à chaque élément.
• le filtre sélectionne les éléments en fonction d'une condition.
• réduire les éléments du tableau agrégés en une seule valeur.
• Ces méthodes favorisent la programmation fonctionnelle et simplifient le traitement des tableaux.

Maîtriser la cartographie, le filtrage et la réduction améliorera vos compétences JavaScript et rendra votre code plus propre et plus efficace.

Bonjour, je m'appelle Abhay Singh Kathayat !
Je suis un développeur full-stack avec une expertise dans les technologies front-end et back-end. Je travaille avec une variété de langages et de frameworks de programmation pour créer des applications efficaces, évolutives et conviviales.
N'hésitez pas à me contacter à mon e-mail professionnel : kaashshorts28@gmail.com.

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!