Estoy tratando de entender cómo funcionan filter() e include() con matrices en javascript, pero el inglés no es mi idioma nativo, por lo que realmente agradecería que alguien me explicara el siguiente ejemplo como si tuviera 5 años:
const removeFromArray = function(...num) { let array = num[0]; return array.filter(val => !num.includes(val)) };Esta función toma una matriz y algunos otros argumentos, luego elimina los otros argumentos de esa matriz, por ejemplo, removeFromArray([1, 2, 3, 4], 3) debe eliminar 3 y devolver [1,2,4]
¿Cómo funciona esta parte?
return array.filter(val => !num.includes(val))¿Por qué el signo de exclamación y también cómo funcionan juntos esos dos métodos?
Creo que la clave para entender lo que está pasando son los parámetros de la función, num . El código usa un buen truco que no he encontrado antes. Entonces, num es:
[[1, 2, 3, 4], 3]; una matriz 1D con DOS elementos: [1, 2, 3, 4] en el índice 0 y 3 en el índice 1 . Como resultado:
num.includes([1, 2, 3, 4]) // is true num.includes(3) // is true num.includes(anything-else) // is falseEl método
Array#includesdetermina si una matriz incluye un cierto valor entre sus entradas, devolviendo verdadero o falso según corresponda.
En la forma más simple, siempre que una expresión booleana tenga el prefijo ! , se negated el resultado de la expresión. Por ejemplo:
!num.includes(3) // becomes falseEl método
Array#filtercrea una nueva matriz con todos los elementos que pasan la prueba implementada por la función proporcionada.
Pasar la prueba simplemente significa devolver verdadero .
Ahora estamos listos para ver num[0].filter(val => !num.includes(val)) . O:
[1, 2, 3, 4].filter(val => !num.includes(val)) Recuerde que SOLO 3 y [1, 2, 3, 4] devuelven true a:
num.includes(val) Por lo tanto, de todos los elementos de num[0] o [1, 2, 3, 4] solo 3 devuelve false a la expresión negada :
!num.includes(val) 1, 2, y 4 devuelven true o !false , lo que significa que pasan la prueba y, por lo tanto, serán devueltos por la función:
[1, 2, 4]; Tenga en cuenta que val => !num.includes(val) es una forma abreviada de escribir:
function( val ) { return !num.includes(val); } const removeFromArray = function(...num) { let array = num[0]; return array.filter(val => !num.includes(val)) }; console.log( removeFromArray([1, 2, 3, 4], 3) );Los parámetros de descanso no deben usarse así, solo deben usarse para valores similares. Por lo tanto, la matriz debe aceptarse por separado y solo los números que se eliminarán deben aceptarse mediante el resto (consulte el fragmento a continuación).
El método include () determina si una matriz incluye un cierto valor entre sus entradas, devolviendo verdadero o falso según corresponda.
Entonces, simplemente filtramos los números que no están presentes en la matriz itemsToRemove .
const removeFromArray = (array, ...itemsToRemove) => array.filter((item) => !itemsToRemove.includes(item)); removeFromArray([1, 2, 3, 4], 3, 2);! significa "no". Si something es falso (nulo, 0, falso, una cadena vacía), entonces !something devuelve true . Esto conduce a un "código de trucos" de aspecto realmente extraño en el que puede convertir cualquier valor en booleano (es decir, verdadero en true y falso en false ) a través de !!value . Un signo de exclamación lo convierte en un valor booleano que es true si el value es falso, luego el segundo signo de exclamación cambia de true a false (o de false a true ).
array.prototype.filter requiere que se evalúe una función contra cada elemento y devuelve una matriz de solo los elementos donde la función proporcionada devuelve un valor verdadero.
Podría ser más fácil pensar en el siguiente código que es casi equivalente al tuyo...
const removeFromArray = function(array, ...valsToRemove) { const isValToKeep = val => array.includes(val) === false; return array.filter(isValToKeep) };La única diferencia en este código, además de ser más largo, es que el primer argumento no se buscará dentro del primer argumento. Considerar
const a1 = [1,2,3]; a1.push(a1); // appends itself as its last element En su versión, removeFromArray(a1, 2) devolvería [1, 3] , pero la mía no combina el primer argumento como uno de los elementos para buscar y eliminar del primer argumento, que es probablemente lo que la mayoría de la gente esperaría y sería más eficaz, pero definitivamente tendría un efecto diferente en el ejemplo que devuelve [1, 3, a1] , es decir, [1, 3, [1, 2, 3, [1, 2, 3, [1, 2, 3, [1, 2, 3, [1, 2, 3, [1, 2, 3, [...]]]]]]]]