Différence symétrique d'un tableau mappé

JavaScriptJavaScriptBeginner
Pratiquer maintenant

This tutorial is from open-source community. Access the source code

💡 Ce tutoriel est traduit par l'IA à partir de la version anglaise. Pour voir la version originale, vous pouvez cliquer ici

Introduction

Dans ce laboratoire, nous allons plonger dans le concept de différence symétrique et découvrir comment il peut être implémenté en JavaScript à l'aide de la fonction symmetricDifferenceBy(). Nous allons explorer comment cette fonction peut être utilisée pour trouver les valeurs uniques entre deux tableaux après avoir appliqué une fonction fournie à chaque élément des deux tableaux. Ce laboratoire est conçu pour vous aider à mieux comprendre cette puissante méthode JavaScript et comment elle peut être utilisée dans vos propres projets.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") javascript/AdvancedConceptsGroup -.-> javascript/destr_assign("Destructuring Assignment") javascript/AdvancedConceptsGroup -.-> javascript/spread_rest("Spread and Rest Operators") subgraph Lab Skills javascript/variables -.-> lab-28487{{"Différence symétrique d'un tableau mappé"}} javascript/data_types -.-> lab-28487{{"Différence symétrique d'un tableau mappé"}} javascript/arith_ops -.-> lab-28487{{"Différence symétrique d'un tableau mappé"}} javascript/comp_ops -.-> lab-28487{{"Différence symétrique d'un tableau mappé"}} javascript/higher_funcs -.-> lab-28487{{"Différence symétrique d'un tableau mappé"}} javascript/destr_assign -.-> lab-28487{{"Différence symétrique d'un tableau mappé"}} javascript/spread_rest -.-> lab-28487{{"Différence symétrique d'un tableau mappé"}} end

Différence symétrique d'un tableau mappé

Pour commencer à coder, ouvrez le Terminal/SSH et tapez node.

Cette fonction renvoie la différence symétrique entre deux tableaux, après avoir appliqué la fonction fournie à chaque élément des deux tableaux. Voici comment elle fonctionne :

  • Créez un Set à partir de chaque tableau pour obtenir les valeurs uniques de chacun d'eux après avoir appliqué fn à leurs éléments.
  • Utilisez Array.prototype.filter() sur chacun d'eux pour ne conserver que les valeurs qui ne sont pas contenues dans l'autre.

Voici le code de la fonction symmetricDifferenceBy :

const symmetricDifferenceBy = (a, b, fn) => {
  const sA = new Set(a.map((v) => fn(v))),
    sB = new Set(b.map((v) => fn(v)));
  return [
    ...a.filter((x) => !sB.has(fn(x))),
    ...b.filter((x) => !sA.has(fn(x)))
  ];
};

Vous pouvez utiliser symmetricDifferenceBy comme ceci :

symmetricDifferenceBy([2.1, 1.2], [2.3, 3.4], Math.floor); // [ 1.2, 3.4 ]
symmetricDifferenceBy(
  [{ id: 1 }, { id: 2 }, { id: 3 }],
  [{ id: 1 }, { id: 2 }, { id: 4 }],
  (i) => i.id
);
// [{ id: 3 }, { id: 4 }]

Sommaire

Félicitations ! Vous avez terminé le laboratoire Différence symétrique d'un tableau mappé. Vous pouvez pratiquer d'autres laboratoires sur LabEx pour améliorer vos compétences.