Diferencia de Arrays Mapeados

JavaScriptJavaScriptBeginner
Practicar Ahora

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

💡 Este tutorial está traducido por IA desde la versión en inglés. Para ver la versión original, puedes hacer clic aquí

Introducción

En este laboratorio, exploraremos la implementación de la función differenceBy en JavaScript. Esta función nos permite encontrar la diferencia entre dos arrays aplicando una función proporcionada a cada elemento de ambos arrays. Aprenderemos a usar Set, Array.prototype.map() y Array.prototype.filter() para comparar y filtrar arrays de manera efectiva según un criterio específico.


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") subgraph Lab Skills javascript/variables -.-> lab-28484{{"Diferencia de Arrays Mapeados"}} javascript/data_types -.-> lab-28484{{"Diferencia de Arrays Mapeados"}} javascript/arith_ops -.-> lab-28484{{"Diferencia de Arrays Mapeados"}} javascript/comp_ops -.-> lab-28484{{"Diferencia de Arrays Mapeados"}} javascript/higher_funcs -.-> lab-28484{{"Diferencia de Arrays Mapeados"}} javascript/destr_assign -.-> lab-28484{{"Diferencia de Arrays Mapeados"}} end

Función para Devolver la Diferencia de Dos Arrays por Mapeo

Para comenzar a codificar, abre tu Terminal/SSH y escribe node.

Esta función toma dos arrays y aplica la función proporcionada a cada elemento de ambos arrays para devolver su diferencia.

Para hacer esto:

  • Crea un Set aplicando la función (fn) a cada elemento del segundo array (b).
  • Utiliza Array.prototype.map() para aplicar la función (fn) a cada elemento del primer array (a).
  • Utiliza Array.prototype.filter() en combinación con la función (fn) en el primer array (a) para conservar solo los valores no contenidos en el segundo array (b), utilizando Set.prototype.has().

Aquí está el código de la función:

const differenceBy = (a, b, fn) => {
  const s = new Set(b.map(fn));
  return a.map(fn).filter((el) => !s.has(el));
};

Aquí hay algunos ejemplos de cómo utilizar la función:

differenceBy([2.1, 1.2], [2.3, 3.4], Math.floor); // [1]
differenceBy([{ x: 2 }, { x: 1 }], [{ x: 1 }], (v) => v.x); // [2]

Resumen

¡Felicitaciones! Has completado el laboratorio de Diferencia de Arrays Mapeados. Puedes practicar más laboratorios en LabEx para mejorar tus habilidades.