Estoy tratando de encontrar elementos de una lista que no están en los elementos de una segunda lista. Casi por pura suerte conseguí que funcionara, pero solo con funciones de flecha. Para mí, las funciones normales son más fáciles de leer, así que intenté convertirlas y el resultado no es el que esperaba.

datos:

 const arr1 = [ { "key": 1, "val": "one" }, { "key": 2, "val": "two" }, { "key": 3, "val": "three" } ] const arr2 = [ { "key": 3, "val": "three" }, { "key": 4, "val": "four" }, { "key": 1, "val": "one" } ]

versión 1

 arr1.filter((element) => arr2.findIndex((innerElement) => element.key === innerElement.key) === -1); // produces object with key 2

versión 2

 arr1.filter(function(element) { return arr2.findIndex(function(innerElement) { element.key === innerElement.key === -1 }) }) // produces all three objects in arr1

Para hacer que el correcto sea más breve, eliminé los paréntesis adicionales y todavía funciona:

 arr1.filter(element => arr2.findIndex(innerElement => element.key === innerElement.key) === -1);

Me estoy perdiendo un aspecto clave aquí. Obtengo que cada elemento en arr1 se pasa a una función y esa función interna a su vez pasa su resultado a otra función y la expresión tiene acceso a ambos conjuntos de argumentos y se ejecuta. Pero creo que tengo el modelo mental equivocado sobre el orden o algo así.

¿Alguien puede explicar qué está sucediendo en cada paso y cómo pensar al respecto? ¿Y cómo lo convierto en una función normal ?

Estaré lidiando con muchas estructuras anidadas y siento que esta es un área débil en la que me gustaría mejorar.

Gracias