Ha llegado un nuevo método a JavaScript, ya casi forma oficial, casi 100%.
JavaScript está consiguiendo un nuevo método que se llama GroupBy, Object.GroupBy.
Y de hecho, os tengo un ejemplo para que entendáis este nuevo método.
Pues JavaScript sigue evolucionando, llega al método Object.GroupBy.
Así que importante, es un nuevo método que al principio iba a llegar a Array,
iba a ser un método como el ForEach, como Find, como Filter,
y iba a llegar ahí, a los Arrays, pero lo han cambiado.
Y ahora, igual que tenemos Object.Keys, vamos a tener Object.GroupBy.
¿Y qué es lo que hace este método?
Pues permite transformar un Array a un objeto,
agrupando los elementos de una propiedad según el callback.
Y lo vamos a ver, ¿vale?
Efectivamente, Iván L'Olivier, qué bueno no tener que seguir usando Reduce para hacer esto,
porque obviamente esto lo podéis hacer con un Reduce, con un ForEach, con mutaciones,
lo podéis hacer con un For, se puede hacer en muchas formas,
pero la forma declarativa con lo que queda esto es espectacular.
Mira, imagina que tenemos este Array de Superhéroes, ¿vale?
Tenemos aquí un Array de Héroes, es un Array con cuatro objetos.
Tenemos Thor, Batman, Iron Man, Superman, cada uno está en su equipo,
y cada uno tiene un poder diferente.
Y mira, tengo por aquí el ejemplo, además.
Tengo el ejemplo, lo tengo por aquí, ya que lo hice por aquí, ¿vale?
¿Ves? Aquí tenemos los Héroes.
¿Qué es lo que podemos hacer?
Imagínate que queremos agrupar, queremos los Arrays,
los queremos separar como en dos, ¿vale?
O sea, queremos tener todos los superhéroes que son de la Liga de la Justicia en un sitio
y los que son los Vengadores en otro.
Pues, ¿qué es lo que podríamos hacer?
Obviamente, a ver, una cosa, ¿cómo podríamos hacer esto antes de enseñaros la forma chula?
Podríamos hacer dos cosas, ¿no?
Podríamos hacer, pues, decir aquí por Teams, ¿no?
Y tendríamos aquí, pues, Avenger.
Aquí tendríamos uno.
Y Justice, y tendríamos aquí otro.
Esta sería la forma más pirata, con un ForEach.
Y aquí tenemos cada héroe.
Y entonces, podríamos decir,
Giros en Teams, podemos meter Giro.Team.
Y aquí, pues, podríamos hacer un Push del Giro.
Y con esto, si no me he equivocado, que soy capaz,
en Teams, ¿vale?
¿Ves? Tenemos ya agrupados aquí.
Tendríamos a los Vengadores un Array con todos los Vengadores.
Y los de la Liga de la Justicia, los tendríamos agrupados un Array con todos los de la Liga de Justicia, ¿vale?
Perfecto.
Esto, a ver, no está mal.
También se podría hacer con un Reduce un poquito más funcional, un poquito más complejo.
En el sentido de que tendríamos que asegurarnos que estamos devolviendo y tal.
Pero bueno, no importa.
Lo podríais hacer con Reduce también.
Pero no hace falta hacerlo con Reduce ya.
Todavía esto no está soportado en todos los navegadores, ya sabéis.
Pero muchas veces esto tampoco importa.
Porque al final, ¿qué más da?
Si esto al final se compila o se transpila.
Luego te voy a enseñar un salseo de eso que te va a encantar.
Se transpila y ya te instala el Polyfill automáticamente.
Si no sabes que es un Polyfill, no te preocupes que ahora te lo explico con un ejemplo.
Entonces, lo que va a llegar, vamos a quitar esto,
lo que va a llegar es un nuevo método en Object que se llama GroupBy, ¿vale?
Y esto lo que hace es devolver justamente un objeto donde va a tener,
vamos a poder agrupar, ¿vale?
Aquí tenemos el Array y podemos pasarle aquí un Callback.
Aquí este sería el Callback que se va a ejecutar para cada uno de los elementos del Array
y nosotros le vamos a indicar en qué grupo lo tiene que dejar.
Por ejemplo, aquí vamos a tener cada uno de los héroes, ¿vale?
Aquí tenemos el héroe, pues primero Thor, luego Batman, Iron Man.
Y simplemente podríamos decirle, vale, pues me los agrupas por el Team, ¿vale?
Solo con esta línea, solo con esta línea, ¿qué es lo que va a pasar?
Pues que en Result vamos a tener agrupados, ¿ves?
Vamos a tener en Avenger, porque tenemos equipo Avenger,
estamos utilizando el Team como Key para agruparlos,
todos los que sean Vengadores me los pones en un Array
y todos los que sean de la Liga de la Justicia me los pones en otro.
O sea que ya los estamos agrupando.
Esto es una funcionalidad que obviamente es muy conocida en SQL
y hay gente que me lo estuvo recordando, pero quiero explicar esto.
Quiero explicar esto, ¿vale?
Uno me decía, esto se hace con Lodash, una librería, ¿vale?
Lodash es una biblioteca de utilidades que tiene un montón
y una de las que tenía era esta de Groupby.
Pero amigos, a ver, sí, esto ya se podía hacer antes de mil formas,
ya había bibliotecas, pero no estaba de forma nativa.
Que estas cosas lleguen de forma nativa al lenguaje siempre es algo positivo
porque uno, el rendimiento va a ser mucho mejor
y dos, no va a tener ningún tipo de impacto en cuanto se descarga de JavaScript, ¿vale?
O sea, lo nativo siempre va a ser mejor, ¿ok?
Muy bien, eso es lo primero.
Y lo segundo es que tenemos por aquí, mira, este, ¿no?
Nicolás dice, imagínate tirar un Groupby fuera de la base de datos
con 500 millones de registros en un 98.
Use la base de datos para queries.
A ver, esto, esto es la típica, con todo mi cariño a Nicolás, ¿vale?
Pero esto es la típica falacia que se suele decir en muchas cosas de programación, ¿no?
Es un ejemplo como muy al extremo.
Es que el Groupby no viene a sustituir el Groupby de SQL.
Obviamente, muchos filtrados, muchos tipos de Groupby
los tienes que hacer a nivel de SQL porque el rendimiento va a ser mucho mejor.
Pero eso no quita que no pueda existir en JavaScript.
Si justamente, si justamente habéis visto que existe en Lodash,
eso es porque hay una necesidad real que en programación lo puedas hacer de una forma sencilla.
Entonces, muchas veces me encuentro con este tipo de comentarios
y no es porque tenga nada en contra de Nicolás,
y entiendo su punto y tiene razón.
Pero una cosa es tener razón y otra cosa es que tenga sentido
con el contexto que estábamos hablando, ¿no?
El otro día puse este TikTok, ¿vale?
Que es, truco para detectar si un array tiene elementos repetidos.
Y entonces mucha gente me decía,
ya, pero si quiero encontrar cuáles son los elementos repetidos,
y yo, bueno, pues harías otra implementación distinta
porque lo que quieres conseguir es distinto.
Y entonces había gente que decía,
pues menuda tontería,
pues estás perdiendo el tiempo porque,
porque claro, estás perdiendo el tiempo porque
si quiero encontrar los repetidos,
entonces, ¿para qué voy a hacer esto?
Y es de palo, bueno, porque son dos cosas distintas.
Es como si dijésemos que en JavaScript
no tiene sentido que exista el find
porque existe el filter, ¿entendéis?
Claro que tiene sentido porque su caso de uso es distinto
y es justamente la gracia de usar cada cosa
para lo que es justamente necesario.
El find te devuelve una cosa en concreto
y lo mismo que puedes utilizar el find,
podrías utilizar el filter para hacerlo del find.
Pero no es exactamente lo mismo, ¿entendéis?
Con estas cosas lo que os quiero decir
es que no tiene mucho sentido esto,
lo que dice Nicolás, que lo entiendo, ¿no?
Imagínate tirar un groupby fuera de la base de datos.
Hay datos que no vienen de una base de datos.
Puede venir de un JSON, puede ser configuración,
puede ser algo que tenga el usuario
que esté introduciendo,
pueden ser mil millones de cosas, ¿sabes?
No tiene, no tiene mucho sentido.
Es como si yo le dijese,
imagínate hacer un insert de una cadena de texto
sin utilizar JavaScript y sin haber escapado nada.
Es que, pues menuda mierda base de datos.
Es que no tiene sentido este tipo de cosas.
Sí, es una remera de One Piece.
¿Qué pasa?
Este sería un ejemplo, por ejemplo,
utilizando, ¿veis?
Si quiero cambiar, que sea de los Vengadores
o de la Liga de la Justicia, ¿no?
Está súper bien.
Pero imaginad que queremos decir,
tener como, si es fuerte o no es fuerte, ¿no?
Por ejemplo, podemos decir,
mira, si el poder del usuario es mayor,
bueno, del usuario, del superhéroe,
es mayor a 50, podemos decir que es súper fuerte.
Y si no, vamos a decir que es humano, ¿vale?
Entonces, ahí, esto sería giro.
Vamos a poner aquí giro.
Lo chulo de esto es que al final
vosotros podéis utilizar esto para agrupar
por lo que vosotros queréis, ¿vale?
Por ejemplo, aquí podemos agrupar
utilizando la propiedad del poder, ¿sabes?
De que si el poder es mayor a 50,
entonces lo meten súper fuerte o súper humano.
Pero os digo más,
no tiene por qué ser binario, ¿vale?
Que esto es un error que mucha gente se cree.
Podéis agrupar por tantas propiedades como queráis.
Por ejemplo, podríais agrupar
por cada una de las primeras letras, ¿sabes?
Podríais decir, mira, podemos decir
giro.nem 0, ¿vale?
Y vamos a agrupar ahora cada uno por su inicial.
Podríais agrupar, oye, pues aquí en la T
tenemos todos los superhéroes que empieza por T.
B, pues Batman, no sé qué.
Y ahí los podríamos agrupar así.
O incluso podríais tener más de uno a base de if.
Podría decir, si el héroe es mayor de 90,
90, entonces el más fuerte.
Si el héroe es mayor de 40, por ejemplo,
Retour, muy fuerte.
Si el héroe es mayor de 20, te explota.
Y si no, pues normalucho, ¿vale?
Y aquí, ¿veis?
Ya lo podéis...
¡Ay, espérate!
¡Ay, el héroe no!
Perdón, es el Power.
Power.
Vamos a poner Power aquí, sacamos el Power.
El héroe no.
Claro, el héroe qué héroe.
El Power, ¿vale?
Y entonces, ¿veis?
Pues también lo podéis agrupar así.
Lo cual está super chulo.
Pues que tengan en cuenta que esto,
a día de hoy, el soporte es bastante limitado.
Solo soporta ahora mismo un 8,8% porque solo Chrome.
Pero fijaos, la próxima versión de Safari ya tiene soporte.
La próxima versión de Edge, que ya está anunciada,
también tiene soporte.
Y la próxima de Firefox, ves que ya tiene aquí una flechita.
O sea, que también va a tener soporte.
Esto, en nada y menos, que ya está llegando a la última versión de Chrome.
Ya lo podéis utilizar.
Pero tened en cuenta que muy pronto todos los navegadores modernos van a tener soporte.