• Ir al contenido principal
  • Skip to secondary menu
  • Ir a la barra lateral primaria
  • Ir al pie de página
  • Inicio
  • Secciones
    • Ciencia de datos
    • Criptografía
    • Herramientas
    • Noticias
    • Opinión
  • Programación
    • JavaScript
    • Julia
    • Matlab
    • Python
    • R
  • Boletín
  • Contacto
  • Acerca de Analytics Lane
  • Tienda
    • Libros
    • Equipamiento de oficina
    • Equipamiento en movilidad
    • Tiendas afiliadas
      • AliExpress
      • Amazon
      • GearBest
      • GeekBuying
      • JoyBuy

Analytics Lane

Ciencia e ingeniería de datos aplicada

  • Ciencia de datos
  • Criptografía
  • Python
  • Matlab
  • R
  • Julia
  • JavaScript
  • Herramientas
  • Opinión
  • Noticias

Métodos para operar sobre arrays en JavaScript de forma eficiente

noviembre 4, 2019 Por Daniel Rodríguez Dejar un comentario

A la hora de trabajar con vectores de objetos el paradigma declarativo utilizado habitualmente el JavaScript puede ser un poco pesado. En estos suele ser más cómodo utilizar paradigma de programación funcional. JavaScript dispone de múltiples métodos para utilizar programación funcional, algunos de los más conocidos son map(), reduce(), filter() y find(). En esta entrada se va a mostrar como utilizar estos métodos para operar sobre arrays en JavaScript de forma eficiente.

La programación funcional

En su gran mayoría el código JavaScript se escribe bajo el paradigma declarativo. Un paradigma en el que cada línea es una instrucción en un proceso que ha de ser ejecutada en un orden concreto. En muchas ocasiones el orden de ejecución de las instrucciones puede ser indiferente, como puede ser a la hora de sumar los números de un vector.

Tradicionalmente estos problemas se resuelven mediante la utilización de un bucle. Pero los métodos de programación funcional permiten hacer esto de forma más eficiente. Para trabajar bajo este paradigma JavaScript disponemos de los métodos filter(), find(), map(), reduce(), every() y some()cuyo funcionamiento básico se explicará a continuación.

filter()

El método filter() permite buscar a los registros de un array que cumple una condición. Devolviendo como resultado un nuevo array con estos elementos.

A modo de ejemplo se puede utilizar un listado de clientes generado aleatoriamente para buscar aquellos que hubiesen gastado más de una cantidad. En el siguiente ejemplo se muestra cómo utilizar filter().

const clients = [{
	"id": 1,
	"name": "Adria Zack",
	"amount": 22.68
}, {
	"id": 2,
	"name": "Libby Willerstone",
	"amount": 11.91
}, {
	"id": 3,
	"name": "Antonetta Brandli",
	"amount": 6.91
}, {
	"id": 4,
	"name": "June Moverley",
	"amount": 7.93
}, {
	"id": 5,
	"name": "Kendrick Lindell",
	"amount": 18.13
}];
	
const spend = clients.filter(client => {
	return client.amount > 10;
});

// El resultado en spend es
// [ { id: 1, name: 'Adria Zack', amount: 22.68 },
//   { id: 2, name: 'Libby Willerstone', amount: 11.91 },
//   { id: 5, name: 'Kendrick Lindell', amount: 18.13 } ]

Lo primero que vemos es que filter() es un método del array al que hay que inyectar una función para aplicar sobre cada uno de los elementos que devuelve un valor verdadero o falso. Siendo seleccionados únicamente los elementos en los que la función devuelve el valor verdadero.

A pesar de ser un código ya compacto la función se puede simplificar. Como el método solamente tiene una línea se pueden eliminar las llaves y la palabra clave return.

const spend = clients.filter(client => client.amount > 10)

Esta línea devuelve los mismos resultados que todas la anteriores, pero es más compacta. Lo que permite dejar el código mucho más compacto y legible.

find()

Cuando solamente se desea identificar un registro que verifica la condición se puede utilizar find() en lugar defilter(). A diferencia del caso anterior el método no devuelve un array sino que el primer objeto que cumpla con la condición. Aplicando este método en el ejemplo anterior se obtendría.

const first = clients.find(client => client.amount > 10);

// El resultado en first es
// { id: 1, name: 'Adria Zack', amount: 22.68 }

every()

Si solamente se quiere comprobar que se cumple una condición se puede utilizar el método every(). Este método devuelve verdadero si todos los registros cumplen con la condición indicada o falso en caso contrario. Lo que permite comprobar si todos los clientes han realizado un gasto mínimo dato.

clients.every(client => client.amount > 5)  // true
clients.every(client => client.amount > 10) // false

En la primera línea el resultado es verdadero porque todos los clientes han gastado más de 5. Pero no así en la segunda, ya que hay clientes que han gastado menos de 10.

some()

Por otro lado para comprobar si algún registro cumple una condición se utilizará el método some(). Este devuelve verdadero si algún registro cumple la condición y falso en caso contrario.

clients.some(client => client.amount > 10) // true
clients.some(client => client.amount > 30) // false

map()

El método map() permite aplicar la función a cada uno de los registros y devolverá un nuevo array con los resultados. Por ejemplo, se puede obtener fácilmente un array con el nombre de los clientes.

const names = clients.map(client => client.name);

// El resultado en names es
// [ 'Adria Zack',
//   'Libby Willerstone',
//   'Antonetta Brandli',
//   'June Moverley',
//   'Kendrick Lindell' ]

reduce()

Finalmente, para obtener un único resultado se dispone del método reduce(). El cual es ligeramente diferente a los vistos anteriormente. En primer lugar, la función a inyectar requiere dos parámetros. El primero es el resultado del paso anterior y el segundo es el elemento evaluado actualmente. Como en la primera iteración no hay un valor previo se pasan los dos elementos del array.

Este método se puede utilizar para obtener el gasto total de los clientes. Lo que se puede hacer como se muestra a continuación.

const amount = clients.reduce((a, b) => {
	return { "amount": a.amount + b.amount };
});

// El resultado en amount es
//  { amount: 67.56 }

Otra alternativa es evaluar si la primera entrada es un elemento del array o un número.

const totalamount = clients.reduce((a, b) => {
	if (a.hasOwnProperty('amount')){
		return a.amount + b.amount;
	}else{
		return a + b.amount;
	}
});

Combinación de los métodos para operar sobre arrays en JavaScript

Si estos métodos son ya potentes por sí solos juntos lo son aún más. Es posible combinar todos ellos para crear complejas operaciones con poco código. Por ejemplo, obtener el nombre de los clientes que han comprado más de una cantidad. Para lo que en primer lugar es necesario aplicar el método filter() y posteriormente el método map(). Antes de aplicar el método map() no es necesario guardar los datos en una variable ya se puede aplicar directamente sobre la salida del método filter().

const names_10 = clients.filter(client => client.amount > 10).map(client => client.name);

Conclusiones

En esta entrada se han visto seis métodos para operar sobre arrays en JavaScript que permite producir código más compacto y claro. Una de las grandes ventajas de la programación funcional. Aunque hay que tener en cuenta que suelen ser más lentos que los bucles for, como se muestra en esta comparativa del rendimiento de los métodos de iteración en JavaScript. Salvo que el rendimiento sea clave y se trabaje con una cantidad enorme de registros estos métodos son una buena solución para mejorar nuestro código.

Imágenes: Pixabay (pasja1000)

¿Te ha parecido de utilidad el contenido?

¡Puntúalo entre una y cinco estrellas!

Puntuación promedio 0 / 5. Votos emitidos: 0

Ya que has encontrado útil este contenido...

¡Síguenos en redes sociales!

¡Siento que este contenido no te haya sido útil!

¡Déjame mejorar este contenido!

Dime, ¿cómo puedo mejorar este contenido?

Contenido relacionado

Archivado en:JavaScript

Interacciones con los lectores

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

I accept the Terms and Conditions and the Privacy Policy

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Publicidad


Barra lateral primaria

Suscríbete a nuestro boletín

Suscríbete al boletín semanal para estar al día de todas las publicaciones.

Política de Privacidad

¡Síguenos en redes sociales!

  • facebook
  • instagram
  • pinterest
  • tumblr
  • twitter
  • youtube
  • github
  • telegram
  • rss

Publicidad

Tiendas afiliadas

Ayúdanos realizando tus compras sin coste adicional con los enlaces de la tienda. ¡Gracias!

Entradas recientes

Epsilon-Greedy para el Bandido Multibrazo (Multi-Armed Bandit)

febrero 26, 2021 Por Daniel Rodríguez Dejar un comentario

Introducción al paquete dplyr del Tidyverse

febrero 24, 2021 Por Daniel Rodríguez Dejar un comentario

Combinar diagramas de caja e histogramas en Python con Seaborn

febrero 22, 2021 Por Daniel Rodríguez Dejar un comentario

Publicidad

Es tendencia

  • ¿Cómo eliminar columnas y filas en un dataframe pandas? bajo Python
  • Seleccionar filas y columnas en Pandas con iloc y loc bajo Python
  • Operaciones de filtrado de DataFrame con Pandas en base a los valores de las columnas bajo Python
  • Unir y combinar dataframes con pandas en Python bajo Python
  • Excel en Python Guardar y leer archivos Excel en Python bajo Python

Publicidad

Lo mejor valorado

5 (3)

Ordenar una matriz en Matlab en base a una fila o columna

5 (3)

Automatizar el análisis de datos con Pandas-Profiling

5 (5)

Diferencias entre var y let en JavaScript

5 (6)

Operaciones de filtrado de DataFrame con Pandas en base a los valores de las columnas

5 (3)

Unir y combinar dataframes con pandas en Python

Publicidad

Comentarios recientes

  • Daniel Rodríguez en Guardar y leer archivos Excel en Python
  • franklin Chiluisa en Guardar y leer archivos Excel en Python
  • Miguel en Guardar y leer archivos CSV con Python
  • Daniel Rodríguez en Guardar diferentes hojas Excel con Python
  • Grevall en Guardar diferentes hojas Excel con Python

Publicidad

Footer

Secciones

  • Ciencia de datos
  • Criptografía
  • Herramientas
  • Noticias
  • Opinión

Programación

  • JavaScript
  • Julia
  • Matlab
  • Python
  • R

Analytics Lane

  • Acerca de Analytics Lane
  • Boletín de noticias
  • Contacto
  • Lo más popular
  • Tienda

Tiendas Afiliadas

  • AliExpress
  • Amazon
  • BangGood
  • GearBest
  • Geekbuying
  • JoyBuy

Sobre de Analytics Lane

En Analytics Lane tratamos de explicar los principales conceptos de la ciencia e ingeniería de datos con un enfoque práctico. Los principales temas tratados son ciencia de datos, ingeniería de datos, inteligencia artificial, machine learning, deep learning y criptografía. Además, también se habla de los principales lenguajes de programación y herramientas utilizadas por los científicos e ingenieros de datos.

Tiendas afiliadas

Ayúdanos realizando tus compras sin coste adicional con los enlaces de la tienda. ¡Gracias!

Amazon

2018-2020 Analytics Lane · Términos y condiciones · Política de Cookies · Política de Privacidad · Herramientas de privacidad · Contacto