Hoy hablaremos sobre el método de matriz reduce Javascript y cómo podemos usarlo para reducir una matriz a un solo valor. Todos los fragmentos de código escritos están en lenguaje Javascript. Se requiere un conocimiento básico del idioma para comprender este artículo e implementar el método de manera efectiva.  ¿Qué es el método de reducción de Javascript?  El método reduce array de Javascript es un componente esencial de la programación funcional que toma un array y lo reduce a solo un valor. Esto se logra ejecutando la función de devolución de llamada en cada elemento de la matriz, pasando el resultado del cálculo al elemento anterior.   const array1 = [1, 2, 3, 4]; // 0 + 1 + 2 + 3 + 4 const initialValue = 0; const sumWithInitial = array1.reduce((accumulator, currentValue) => accumulator + currentValue, initialValue) console.log(sumWithInitial); // expected output: 10  El fragmento de código anterior es una matriz de números; cuando llamamos al método reduce, toma toda la matriz y devuelve solo un valor que es 10.  Comprender los parámetros y el argumento de Javascript "reducir"  Es importante tener una comprensión muy concreta de cuáles son los parámetros de Javascript "reducir" si debemos usar el método correctamente. A continuación, he resaltado estos parámetros; los tomaremos uno tras otro, luego, al final, uniremos todo para darle sentido.  función de devolución de llamada  valor inicial   función de devolución de llamada  Esta función se ejecuta en cada elemento de la matriz. En la ejecución posterior de la devolución de llamada Fn, su valor de retorno se cambia al valor del argumento del acumulador. El valor de retorno cambia a reduce(), para la invocación final.  Los siguientes parámetros se proporcionan al llamar a la función:  acumulador  valor actual  índice actual  formación   Acumulador  Este es el resultado de la última llamada a devolución de llamada Fn, en valor. Si se proporciona, initialValue se usa en la primera llamada; si no, se usa array[0].   valor actual  Este es el valor del elemento actual. Si se proporcionó un initialValue, el valor de la matriz en el índice 0 (array[0]) se devolvería en la primera llamada; si no, se devolvería el índice 1 (arreglo[1]).   ÍndiceActual  Esta es la posición de índice del valor actual de la matriz. Si se proporcionó initialValue en la primera llamada, su posición estaría en el índice 0; de lo contrario, estaría en el índice 1.   Formación  Esta es simplemente la matriz en la que se utilizó el método reduce().   valor inicial  Un valor que se usa para inicializar el acumulador en la primera devolución de llamada. Si se proporciona initialValue, callbackFn comienza a ejecutarse con currentValue establecido en el primer elemento de la matriz. Si se omite initialValue, el acumulador se establece en el primer valor de la matriz y callbackFn comienza a ejecutarse con currentValue establecido en el segundo valor de la matriz. Si la matriz está vacía en este escenario (es decir, no hay ningún elemento inicial para devolver como acumulador), se genera un error.   Poniendo todo junto  reducir (Función (acumulador, valor actual, índice actual, matriz) { /* … */ }, valor inicial)  La combinación de todos estos parámetros debería parecerse al fragmento de código anterior.  ¿Cómo funciona el método Javascript "reducir"?  Profundicemos más en este método de Javascript reducido y veamos qué sucede detrás de escena.   const array1 = [1, 2, 3, 4]; // 0 + 1 + 2 + 3 + 4 const initialValue = 0; const sumWithInitial = array1.reduce( (accumulator, currentValue) => accumulator + currentValue, initialValue );  Todo lo que hace el método reduce de Javascript es recorrer el elemento, y cada vez que se recorre, devolvemos un elemento individual y obtenemos el valor anterior que devolvimos de reduce(). Si es el primer elemento en reduce(), solo obtenemos cero porque ese es nuestro valor predeterminado. Si cambiamos el valor predeterminado a 50, por ejemplo, afectaría a la matriz.  Tomamos cero o el número predeterminado y lo agregamos a nuestro primer elemento; obtendríamos un total que sería 1 en el código anterior. Lo hacemos de nuevo para el siguiente elemento, que es 2. Sumamos 1 + 2 y obtenemos 3; continuamos este proceso hasta llegar al elemento final.  acumulador  valor actual  índice  Valor devuelto  1ra llamada  0  1  0  1  2da llamada  1  2  1  3  3ra llamada  3  3  2  6  4ta llamada  6  4  3  10  La tabla de arriba da una idea más clara de lo que sucede cada vez que usamos este método. Tenga en cuenta que este resultado variará según initialValue.  Conclusión  En una nota final, reduce Javascript es un método iterativo. Recopila todos los elementos de la matriz en un solo valor aplicando una función de devolución de llamada "reductora" a cada elemento en orden de índice ascendente. El valor de retorno de callbackFn siempre se proporciona como un acumulador cuando se vuelve a llamar a callbackFn. Reduce devuelve su valor de retorno desde el último valor del acumulador, que es el valor devuelto por la devolución de llamada Fn en la última iteración de la matriz ().  Si bien la función proporcionada como devolución de llamada-Fn puede modificar, la matriz en la que se llama, reduce() no lo hace. Sin embargo, tenga en cuenta que la longitud de la matriz se conserva antes de la ejecución de Fn de devolución de llamada inicial.

2022 - HackerNoon Contributor of the Year - Coding

Reducir Javascript: dominar los conceptos básicos

About Author

COMENTARIOS

ETIQUETAS

ESTE ARTÍCULO FUE PRESENTADO EN

Related Stories

La guía completa para una migración exitosa a la nube: estrategias y mejores prácticas

Toque para ganar: Telegram puede incorporar a los próximos 10 mil millones de usuarios de criptomonedas antes de Solana

Liberando el poder de la IA. Una revisión sistemática de técnicas de vanguardia: resumen e introducción

Las capas invisibles: por qué las entrevistas con los usuarios son un activo irremplazable

La guía completa para una migración exitosa a la nube: estrategias y mejores prácticas

Toque para ganar: Telegram puede incorporar a los próximos 10 mil millones de usuarios de criptomonedas antes de Solana

Liberando el poder de la IA. Una revisión sistemática de técnicas de vanguardia: resumen e introducción

Las capas invisibles: por qué las entrevistas con los usuarios son un activo irremplazable

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps