Introducción al curso
¡Alto! Tenemos una nueva versión de este curso para ti
Bienvenidos al Curso de Fundamentos de JavaScript
Repositorio de este curso de fundamentos de JS
Primeros pasos en JavaScript
Variables
Variables: Strings
Variables: Números
Funciones
El alcance de las funciones
Objetos
Desestructurar objetos
Parámetros como referencia o como valor
Comparaciones en JavaScript
Estructuras de Control y Funciones
Condicionales
Funciones que retornan valores
Arrow functions
Estructuras repetitivas: for
Estructuras repetitivas: while
Estructuras repetitivas: do-while
Condicional múltiple: switch
Arrays
Introducción a arrays
Filtrar un array
Transformar un array
Reducir un array a un valor
Programación Orientada a Objetos en JavaScript
Cómo funcionan las clases en JavaScript
Modificando un prototipo
El contexto de las funciones: quién es this
La verdad oculta sobre las clases en JavaScript
Clases en JavaScript
Asincronismo
Funciones como parámetros
Cómo funciona el asincronismo en JavaScript
Cómo funciona el tiempo en JavaScript
¿Qué pasó con swapi.co?
Callbacks
Haciendo múltiples requests
Manejando el Orden y el Asincronismo en JavaScript
Manejo de errores con callbacks
Promesas
Promesas Encadenadas
Múltiples promesas en paralelo
Async-await: lo último en asincronismo
Juego de HTML
Comenzando el juego
Generando una secuencia de números
Iluminando la secuencia de colores
Obteniendo el input del usuario
Agregando la verificación del color elegido
Agregando los estados finales del juego
Conclusiones del curso
Complementos
Diferencias entre var, let y const
Memoización: ahorrando cómputo
¿Hace cuántos días naciste?
Funciones recursivas
Entiende los closures de JavaScript
Estructuras de datos inmutables
Cambiando de contexto al llamar a una función
¿Cuándo hace falta poner el punto y coma al final de la línea?
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
El método reduce() nos permite reducir, mediante una función que se aplica a cada uno de los elemento del array, todos los elementos de dicho array, a un valor único.
Aportes 258
Preguntas 40
Muy interesante todas las funciones que hay en JavaScript para manejo de Array
Les comparto de nuevo mis apuntes sobre Arrays en cornell notes con sus respectivas actualizaciones!
aca los apuntes de esta clase
REDUCIR UN ARRAY A UN VALOR
Una de las funciones mas comunes al usar un array es un reduce, esto lo que va a hacer es reducir un array a un valor único, acá lo siguiente que haremos será agregar cierta cantidad de libros a cada persona y sacar la cuenta del total de libros que hay.
var angel = {
nombre: 'Angel',
apellido: 'Sulbaran',
altura: 1.71,
cantidadDeLibros: 254
}
var pepe = {
nombre: 'Pepe',
apellido: 'Trueno',
altura: 1.92,
cantidadDeLibros: 985
}
var tom = {
nombre: 'Tom',
apellido: 'Holland',
altura: 1.73,
cantidadDeLibros: 70
}
var marco = {
nombre: 'Marco',
apellido: 'Polo',
altura: 1.75,
cantidadDeLibros: 28
}
var emma = {
nombre: 'Emma',
apellido: 'Stone',
altura: 1.66,
cantidadDeLibros: 85
}
var robert = {
nombre: 'Robert',
apellido: 'Downey Jr.',
altura: 1.74,
cantidadDeLibros: 855
}
var personas = [angel, pepe, tom, marco, emma, robert]
Pare esto es valido hacer un ciclo for de la siguiente manera.
var acum = 0
for(var i = 0; i < personas.length; i++){
acum = acum + personas [i].cantidadDeLibros
}
console.log(`En total todos tienen ${acum} libros`)
Pero existe una manera mas optimizada de hacerlo
const reducer = (acum, persona) => {
return acum + persona.cantidadDeLibros
}
var totalDeLibros = personas.reduce(reducer, 0)
console.log(`En total todos tienen ${totalDeLibros} libros`)
Esto funciona de la siguiente maneta, como podemos ver en “totalDeLibros” llamamos a la funcion con “personas.reduce” para reducir el array de personas a un total y para reducirlo necesitamos de dos cosas, una funcion y el valor inicial del acumulador “(reducer, 0)” y la funcion reducer al crearla recibe dos parámetros, recibe el acumulador y cada uno de los elementos “personas” inicias el arrow function y modificas el valor que quieres que tenga el nuevo acumulador;
const reducer = (acum, persona) => {
return acum + persona.cantidadDeLibros
}
Una forma de organizar un poco mejor esto es de la siguiente manera;
const reducer = (acum, persona) => acum + persona.cantidadDeLibros
Porque recordando clases pasadas, arrow function nos da un return automatico si es una función tan simple como esta, es decir, hacer un return como única funcion. O incluso podríamos hacerlo de esta manera
const reducer = (acum, {cantidadDeLibros}) => acum + cantidadDeLibros
Por que así desestructuramos personas y decimos que solo queremos tener acceso a la cantidad de libros.
APORTE DE RESUMEN DE LA CLASE
// RESUMEN DE LA CLASE : 'REDUCIR UN ARRAY A UN VALOR'
// - Tomaremos como referencia el codigo anterior de la clase. Pero esta vez se
// agrego el atributo 'cantidadDeLibros' que tiene como valor cierto numero.
var fernando = {
nombre:'Fernando',
apellido:'Huaman',
altura:1.68,
cantidadDeLibros: 58
}
var gabriel = {
nombre:'Gabriel',
apellido:'Gonzalez',
altura:1.81,
cantidadDeLibros: 87
}
var homero = {
nombre:'Homero',
apellido:'Simpsoms',
altura:1.5,
cantidadDeLibros: 157
}
var italo = {
nombre:'Italo',
apellido:'Rodriguez',
altura:1.9,
cantidadDeLibros: 113
}
var personas = [fernando,gabriel,homero,italo]
// - Lo que se quiere en esta clase es sumar los valores de el atributo 'cantidadDeLibros'
// de cada uno de los objetos.
// - Se puede hacer de dos formas:
//
// -----> PRIMERA FORMA
// - Podemos declarar una variable 'acumulador' cuyo valor sea cero (0).
// - Luego, a traves de un ciclo for recorrer los objetos que estan
// contenidos en el array 'personas' y que en la variable 'acumulador'
// se vaya sumando los valores del atributo 'cantidadDeLibros'. Ejemplo:
//
// var acumulador = 0
//
// for (var i=0 ; i<personas.length ; i++){
// acumulador += personas[i].cantidadDeLibros
// }
//
// -----> SEGUNDA FORMA
// - Para este caso nos apoyaremos de la funcion " reduce() ", que reduce
// el array a un solo valor. Lo que queremos que haga en este caso seria
// que reduzca el array personas (que esta compuesta por objetos) a
// solamente los valores de el atributo 'cantidadDeLibros'.
// - Luego queremos que recorra el nuevo array 'persona' y vaya sumando
// los valores.
// - Estructura de la funcion reduce()
//
// ---> var Nombre_Variable = Nombre_Array.reduce(Funcion , Primer_Parametro)
//
// Ejemplo:
//
const reducer = (acumulador,{cantidadDeLibros}) => acumulador + cantidadDeLibros
// acumulador = 0
//
var totalDeLibros = personas.reduce(reducer , 0)
// | |
// | |
// | |
// V V
// Funcion Primer Parametro de la funcion
//
console.log(`En total todos tiene ${totalDeLibros} libros`)
Estudien bien esto! sale en el examen xD
Cuando nos referimos a reducir un array a un valor por lo general es sinónimo de sumar todos los elementos para obtener un valor único, ya sea de un array o de un elemento en específico. En este caso reduciremos la cantidad de libros de 6 personas con la función reduce()
reduce() recibe solo 1 array y 2 parámetros, los cuales son: Una función y el valor inicial de los elementos.
array.reduce(funcion, valor inicial (0));
var resultado = array.reduce(funcion[, valorInicial]);
valorInicial = Objeto a usar como primer argumento en la primera llamada de la funcion.
A esta altura del curso recomiendo:
hice un ejemplo en el que se busca la nota promedio de los estudiantes
var Pedro =
{
nombre: 'Pedro',
apellido: 'Martinez',
altura: 1.75,
cantidadLibros: 29,
nota: 7.5
}
var Mario =
{
nombre: 'Mario',
apellido: 'Juarez',
altura: 1.80,
cantidadLibros: 50,
nota: 4.5
}
var Camila =
{
nombre: 'Camila',
apellido: 'Milter',
altura: 1.65,
cantidadLibros: 110,
nota: 8.9
}
var Fernanda =
{
nombre: 'Fernanda',
apellido: 'Portillo',
altura: 1.68,
cantidadLibros: 80,
nota: 6.9
}
var personas = [Pedro, Mario, Camila, Fernanda];
const sumaNota = (d, {nota}) => (d+nota);
var notaMedia = (personas.reduce(sumaNota, 0).toFixed(2))/personas.length;
console.log(notaMedia);
En esta función:
const reducer = (acum, persona) => acum + persona.cantidadDeLibros
var totalDeLibros = personas.reduce(reducer, 0)
Dónde estaríamos pasando el parámetro de ‘acum’ cuando invocamos la función?
No termino de entender cómo funciona.
Alguien podría explicarme?
// Datos de personas que en este punto serian objetos con propiedades que deberia tener cada persona
var rene = {
nombre: 'René',
apellido: 'Sanchez',
altura: 1.75,
libros: 182
};
var vicky = {
nombre: 'Vicky',
apellido: 'Zapata',
altura: 1.56,
libros: 91
};
var paula = {
nombre: 'Paula',
apellido: 'Barros',
altura: 1.76,
libros: 182
};
var alan = {
nombre: 'Alan',
apellido: 'Perez',
altura: 1.86,
libros: 90
};
var martin = {
nombre: 'Martin',
apellido: 'Gomez',
altura: 1.85,
libros: 132
};
var dario = {
nombre: 'Dario',
apellido: 'Jaurez',
altura: 1.71,
libros: 78
};
// Creamos una cajita que contendra todas nuestras personas y las ordenara en base al orden en el cual guardamos los datos de las personas(objetos)
var personas = [rene,alan,martin,vicky,paula];
// Creamos un ciclo en el cual nosotros recorremos nuestra cajita en el cual siempre inicia en 0 por ej: tengo 5 datos verdad entonces si quiero ver todo lo que tiene paula deberia ser la posicion 5 no ?
// Pues no es asi como empieza en 0 la cajita entonces simplemente seria la cantidad total de personas - 1, para acceder al ultimo dato y 0 para el primer dato
// De tal forma simplemente ponemos la condicion que mientras i(valor inicial) sea menor a la cantiddad de datos de nuestra cajita
// Tener en mente que hay momento donde no sabes cuantos datos tenemos por que tiene demaciados seria una tortura ir contando de uno en uno por ende se creo la propiedad length(largo o cantidad de datos que contiene una cajita(array)) con el nosotros nos ahorramos ese tema y simplemente nos enfocamos en que queremos hacer en este caso
for (let i = 0; i < personas.length; i++) {
const nombre = personas[i].nombre;
const altura = personas[i].altura;
console.log(`La altura de la persona ${nombre} es: ${altura}`);
}
// Filtrar elementos
const ALTURA_MAYOR = 1.8;
// Solo cuando tiene mas de un parametro se usan los parentecis en la funcion anonima u donde queremos solamente recibir una propiedad en concreto
const esAlta = persona => persona.altura > ALTURA_MAYOR;
// Version aun mas abreviada ya que solo nos importa en este "caso" la altura en si
const esMasAlta = ({altura}) => altura > ALTURA_MAYOR;
// Existe una propiedad para las cajitas que contienen personas(objetos)
// La cual es para filtrar en base a una funcion y el se encargara de hacer el ciclo y aumentos para filtrar a cada dato en base a una funcion que nosotros creemos
// no hay necesidad de usar los () para hacerla como funcion ya que es una constante siendo una funcion en si misma dentro
var personasAltas = personas.filter(esAlta);
// Version con funcion anonima y como se puede apreciar a veces esto provoca algo de complejidad al entender el sistema tanto nosotros u nuestro equipo que trabajara con nosotros
// La idea es hacer clara cada cosa que nosotros vamos desarrollando
// Recordar los principio solid, cada funcion tiene solo una responsabilidad por ende este tendria 2 responsaiblidades cuando debe tener solo una
var personasMasAltas = personas.filter((persona) => persona.altura > ALTURA_MAYOR)
// Reto!!!!!
// Crear un filtrado de los datos de nuestra cajita con las personas de mas baja altura y ahora con lo que hemos visto facilicimo no ?
const esBaja = ({altura}) => altura < ALTURA_MAYOR;
var personasBajas = personas.filter(esBaja);
// Cuando creamos funciones anonimas tenemos que tener en cuenta 2 factores
// 1- Si simplemente necesitamos que nos retorna un resultado o objeto completos ej: persona => persona.altura *= 100 que nos devolvera el resultado en si no un objeto completo con la modificacion
// 2- si simplemente queremos tener mas de un resultado en este punto ej: quiero ahora multiplicar la altura de la persona y quiero que me devuelva una persona nueva, que en este punto se ha modificado a dicha persona
// En este punto vemos que nosotros encesitaremos usar las {} en este punto ya que necesitamos hacer 2 cosas para poder obtener lo que queriamos u creamos para tener un objeto nuevo con esto
const pasarAlturaACms = persona => {
// Esto modificaba toda nuestra cajita sin nosotros querer que haga algo asi
// persona.altura *= 100
// return persona
// Nuevo objeto copiando todas las caracteristicas de nuestras personitas
// con esto logramos que no se modifique con la funcion map establecida para las cajitas(arrays o arreglos de datos o contenedor de datos, busca el tuyo ahora crea tu propio concepto pero del mismo camino que este es simplemente guardar datos)
return {
...persona,
altura: persona.altura * 100
};
};
// Version mas sencilla en no tener que escribir todo lo anterior de alguna forma, ahora para que nosotros en funcion anonima devolvamos un objeto en una forma mas sencilla como cuando nos daba un valor es de esta forma:
// dato => ({}) se usan parentesis y dentro llaves para que de esta forma nos devuelva el objeto dentro que nosotros creemos o estructuremos
// dato => ({...objetoCopiar,propiedad: valor})
// tener en cuenta que cuando copiamos un objeto y ahora queremos agregarle un cambio usamos la , para añadirle o modificar ese dato que existe dentro del objeto dentro
// ej: casa => ({...casa,altura: casa.altura * 100})
const pasarAlturaACms2 = persona => ({
...persona,
altura: persona.altura * 100
})
// Map nos devuelve una cajita nueva en este punto nosotros modificamos nuestra cajita, por ende no creamos otra caja nueva que contenga esos valores sino que cambio todo el sistema en si que teniamos
// Por ende nosotros ahora modificamos la funcion anonima del que pasa la altura a centimentros, creamos un nuevo objeto de cada uno de ellos para que de esta forma no afectemos al original con sus medidades
var personasCms = personas.map(pasarAlturaACms);
console.log(personasCms);
// Esta forma de obtenerla tambien esta bien pero la funcion siguiente lo hace aun mas sencillo el obtener el dato completo aun que este tampoco esta mal
// var acumulador = 0;
// for (let i = 0; i < personas.length; i++) {
// acumulador += personas[i].libros;
// console.log(acumulador);
// }
// Aqui creamos la funcion que se encargara de tener la cantidad de libros en total de todas las personas que tienen u leen libros
// necesitamos 2 valores por ende usaremos un parentecis(contador, persona) => contador += persona.propiedad(en este caso los libros que posee)
const cantidadDeLibros = (contador, persona) => contador += persona.libros;
// La otra forma de hacerlo aun mas sencillo es esta
const cantidadDeLibros2 = (contador, {libros}) => contador += libros;
// Supongamos que nosotros queremos saber el total de un valor en concreto de los datos que tenemos, como ej usaremos que cada persona lee libros o posee libros
// En este punto ahora solo queremos saber el valor que tiene cada uno y sacar un total de todas las personas que poseen esa propiedad o caracteristica que tambien puede ser que tengan hijos o no, todo depende del caso que nosotros queramos resolver o crear una solucion para tener ese dato total
// El unico fin que tiene la funcion reduce es obtener un valor total de algun dato u cantidad de cosas que poseemos en total
// Pongamos que quiero recibir un total de todos los autos que tienen todas las personas que estan en mi cajita de personitas, entonces para esa instancia usaria un reduce en la cajita y creo una funcion que se encargara de obtener esos valores, tambien tengo que indicarle en que posicion de mi cajita empezara a obtener los datos en este punto nosotros usamos el 0
// iniciara desde el primer dato que se creo en nuestra cajita, asi que primero creamos una funcion que se encarge de proveernos ese valor que nosotros queremos en este punto nosotros necesitamos saber el total de libros de las personas
// Creamos una funcion que se encarga de tener las cantidades de libros y devolvernos ese resultado para esto creamos una funcion anonima, aparte de nosotros haber creado la funcion tenemos que ahora darle desde que punto nosotros queremos obtener el total en este caso queremos todos empezando desde el inicio (0) final(cajita -1)
var totalDeLibros = personas.reduce(cantidadDeLibros2, 0);
console.log(totalDeLibros);```
Mientras realizaba el ejercicio, me di cuenta que si todos los elementos del objeto no tienen la clave que se quiere sumar por ejemplo
var edison = {
nombre : 'Edison'
}
var andres = {
nombre : 'Andres',
libros : 10
}
var arr = [edison,andres]
al final el programa nos dará como respuesta NaN
Solo quiero decir que la informacion de este codigo es estimada:
var jaime=
{
nombre :"Jaime",
apellido : "Lannister",
edad : 48,
estatura : 1.87,
dragonesdeOro:0,
}
var cersei =
{
nombre :"Cersei",
apellido : "Lannister",
edad : 44,
estatura : 1.68,
dragonesdeOro:1000000,
}
var tyrion =
{
nombre :"Tyrion",
apellido : "Lannister",
edad : 49,
estatura : 1.35,
dragonesdeOro:10000,
}
var hodor =
{
nombre :"Hodor",
edad : 43,
estatura : 2.13,
dragonesdeOro:0.01,
}
var elPerro =
{
nombre : "Sandor",
apellido :" Clegane",
edad : 50,
estatura : 1.98,
dragonesdeOro:0.1,
}
var laMontaña =
{
nombre : "Gregor",
apellido : " Clegane",
edad : 30,
estatura : 2.06,
dragonesdeOro:5,
}
var brienne =
{
nombre : "Brienne",
apellido : "de Tarth",
estatura : 1.91,
edad: 40,
dragonesdeOro:0,
}
var sansa =
{
nombre :"Sansa",
apellido : "Stark",
estatura : 1.75,
edad : 23,
dragonesdeOro:500000,
}
var ned =
{
nombre :"Ned",
apellido : "Stark",
edad : 60,
estatura : 1.79,
dragonesdeOro:600000,
}
var khaleesi =
{
nombre :"Daenerys",
apellido : "Targeryen",
edad : 32,
estatura : 1.57,
dragonesdeOro:10000000, //los dragones son invaluables
}
var personajesGoT=[jaime,cersei,tyrion,hodor,elPerro,laMontaña,brienne,sansa,ned,khaleesi]
const reductor = (riqueza,{dragonesdeOro}) => riqueza+=dragonesdeOro
var CuantosDragonesdeOroenPoniente=personajesGoT.reduce(reductor,0) //funcion para hacer una suma de todos los dragones de oro
console.log(`El total de dragones de oro son ${CuantosDragonesdeOroenPoniente}`);```
No manches. Yo siempre use el ciclo for. Desde ahora solo reduce.
const reducer = (acum, persona) => {
return acum + persona.cantidadDeLibros
}
var totalDeLibros = personas.reduce(reducer, 0)
console.log(`En total todos tienen ${totalDeLibros} libros`)
Tengo una duda con respecto a la funcion reduce, entiendo que acepta dos parametros, la funcion reducer y el valor incial del acum, mi duda está en como la funcion reducer relaciona su acum con el que esta en reduce, y si el orden de los parametros es fundamental.
creo que le faltan desafíos en donde apliquemos lo que dice, es básicamente una documentación leída de javascript, una función tras otra.
mis apuntes:
//Reduce()
/* reduce el valor de un array a un valor único
*/
/* vamos a sacar la cantidad de libros hay (total de libros)*/
var liam = {
nombre: 'Liam',
apellido: 'León',
edad: 18,
altura: 1.72,
libros: 81
}
var clifort = {
nombre: 'Clifort',
apellido: 'Collins',
edad: 19,
altura: 1.58,
libros: 182
}
var paula = {
nombre: 'Paula',
apellido: 'Benavides',
edad: 21,
altura: 1.72,
libros: 91
}
var natanael = {
nombre: 'Natanael',
apellido: 'León',
edad: 18,
altura: 1.82,
libros: 90
}
var jhonatan = {
nombre: 'Jhonatan',
apellido: 'Lizcano',
edad: 19,
altura: 1.93,
libros: 78
}
/* así se representa un array: [] y puede contener num, objetos, funciones, incluso mezclar cosas etc*/
var personas = [liam, paula, clifort, natanael, jhonatan]
/* lo mismo pero mediante un for imprimimos la cantidad de libros
var acum = 0
for (var i=0; i < personas.length; i++){
acum = acum + personas[i].libros
}
console.log(`En total todos tienen ${acum} libros`)*/
/*
const reducer = (acum, persona) =>{
return acum + persona.libros
}*/
const reducer = (acum, { libros }) => acum + libros
/*Para usar el reduce necesitamos 2 cosas: una function y el valor inicial o original
*/
var totalDeLibros = personas.reduce(reducer, 0)
console.log(`Total de libros: ${totalDeLibros}`)
Más reducido
var totalDeLibros = personas.reduce((acum, { cantidadDeLibros }) => acum + cantidadDeLibros,0);
para iterar sobre arrays se usa forEach al contrario del for
Esto realice en base a las clases anteriores, asi pude entender la fus funciones filter, map y reduce
/**
* 1 - Separar en clases economicas: baja(<1500) media(<5000) alta(>=5000)
* 2 - Calcular impuestos segun su clase: baja(-2%) media(-5%) alta(-15%)
* 3 - Calcular el total de riqueza antes y despues de la aplicacion de impuestos
*/
var persona1 = {
nombre: 'sacha',
edad: 21,
dinero: 1500
}
var persona2 = {
nombre: 'juan',
edad: 28,
dinero: 4500
}
var persona3 = {
nombre: 'jose',
edad: 33,
dinero: 2000
}
var persona4 = {
nombre: 'raul',
edad: 43,
dinero: 6000
}
var persona5 = {
nombre: 'isaac',
edad: 20,
dinero: 10000
}
var persona6 = {
nombre: 'borges',
edad: 16,
dinero: 500
}
var personas = [persona1, persona2, persona3, persona4, persona5, persona6]
/**
* 1 - Separar en clases economicas: baja(<1500) media(<5000) alta(>=5000)
*/
const TOPE_BAJO = 1500
const TOPE_MEDIO = 5000
/**
*
* @param {persona} dinero
* @returns {boolean} true or false
*/
const esClaseBaja = ({dinero}) => dinero < TOPE_BAJO
/**
*
* @param {persona} dinero
* @returns {boolean} true or false
*/
const esClaseMedia = ({dinero}) => dinero >= TOPE_BAJO && dinero < TOPE_MEDIO
/**
*
* @param {persona} dinero
* @returns {boolean} true or false
*/
const esClaseAlta = ({dinero}) => dinero >= TOPE_MEDIO
var personasClaseBaja = personas.filter(esClaseBaja)
var personasClaseMedia = personas.filter(esClaseMedia)
var personasClaseAlta = personas.filter(esClaseAlta)
/**
* 2 - Calcular impuestos segun su clase: baja(-2%) media(-5%) alta(-15%)
*/
/**
*
* @param {persona} persona
* @returns {impuesto} ...persona + impuestos
*/
const calcularImpuestos = persona => ({
...persona,
impuestos: persona.dinero < TOPE_BAJO ? (persona.dinero - persona.dinero * 0.98) :
persona.dinero >= TOPE_BAJO && persona.dinero < TOPE_MEDIO ? (persona.dinero - persona.dinero * 0.95) :
(persona.dinero - persona.dinero * 0.85)
})
var impuestos = personas.map(calcularImpuestos)
/**
* 3 - Calcular el total de riqueza antes y despues de la aplicacion de impuestos
*/
/**
*
* @param {integer} acum variable acumuladora
* @param {persona} dinero dinero del objeto persona
* @returns {integer} resultado de la variable acumuladora
*/
const calcularPrevia = (acum, { dinero }) => acum + dinero
/**
*
* @param {integer} acum variable acumuladora
* @param {persona} persona que tiene los atributos dinero e impuestos
* @returns {integer} resultado de la variable acumuladora entre el dinero de la persona y la diferencia con
* sus impuestos
*/
const calcularPosterior = (acum, persona) => acum + persona.dinero - persona.impuestos
var riqueza = {
pervia: 0,
posterior: 0
}
riqueza.pervia = personas.reduce(calcularPrevia, 0)
riqueza.posterior = impuestos.reduce(calcularPosterior, 0)
Ahora Digamos que quiero conocer el promedio de edad de mis jugadores
EJERCICIO
Buenas tardes, gracia por la clase profe!! Una inquietud, alguien sabe de una página donde podamos aprender los shot cuts (Atajos de teclado) de visual estudio code como el de comentar varias lineas de código, cambiar de lugar una linea y así. Gracias
Estos son los momentos en los que extraño np.sum()
var sacha = {
nombre: 'Sacha',
apellido: 'Lifszyc',
altura: 1.72,
cantidadDeLibros: 111
}
var alan = {
nombre: 'Alan',
apellido: 'Perez',
altura: 1.86,
cantidadDeLibros: 78
}
var martin = {
nombre: 'Martin',
apellido: 'Gomez',
altura: 1.85,
cantidadDeLibros: 132
}
var dario = {
nombre: 'Dario',
apellido: 'Juarez',
altura: 1.71,
cantidadDeLibros: 90
}
var vicky = {
nombre: 'Vicky',
apellido: 'Zapata',
altura: 1.56,
cantidadDeLibros: 91
}
var paula = {
nombre: 'Paula',
apellido: 'Barros',
altura: 1.76,
cantidadDeLibros: 182
}
const reducer = (acum, {cantidadDeLibros}) => acum + cantidadDeLibros
var totalDeLibros = personas.reduce(reducer, 0)
console.log(en total todos tienen ${totalDeLibros} libros
)
las definiciones y usos según W3
The reduce() method reduces the array to a single value.
The reduce() method executes a provided function for each value of the array (from left-to-right).
The return value of the function is stored in an accumulator (result/total).
podrias explicar mejor
Este mundo es nuevo realmente para mi, estoy aprendiendo y todo esto me genera confusión así no se vea complejo.
Si le dieran una moneda a Sacha por cada vez que dice ‘prolijo’, seguro se haría millonario en poco tiempo.
Función Reduce
Es otra de las funciones más usadas con arrays en JS.
Reduce un array a un valor único.
En esta clase lo que queremos es calcular la cantidad total de libros de las personas definidas en los siguientes objetos:
var sacha = {
nombre: 'Sacha',
apellido: 'Lifszyc',
altura: 1.72,
cantidadDeLibros: 111
}
var alan = {
nombre: 'Alan',
apellido: 'Perez',
altura: 1.86,
cantidadDeLibros: 78
}
var martin = {
nombre: 'Martin',
apellido: 'Gomez',
altura: 1.85,
cantidadDeLibros: 132
}
var dario = {
nombre: 'Dario',
apellido: 'Juarez',
altura: 1.71,
cantidadDeLibros: 90
}
var vicky = {
nombre: 'Vicky',
apellido: 'Zapata',
altura: 1.56,
cantidadDeLibros: 91
}
var paula = {
nombre: 'Paula',
apellido: 'Barros',
altura: 1.76,
cantidadDeLibros: 182
}
Es posible y válido usar un for loop para este task:
var acum = 0
for (var i = 0; i < personas.length; i++) {
acum = acum + personas[i].cantidadDeLibros
}
console.log(`En total todos tienen ${acum} libros.`)
Usando la función reduce(func, val.inic.acum.):
const reducer = (acum, persona) => acum + persona.cantidadDeLibros
var totalDeLibros = personas.reduce(reducer, 0)
console.log(`En total todos tienen ${totalDeLibros} libros.`)
En la función reduce Esta ya obtiene los datos en ese orden ( acum , persona) o lo puedo poner al revés?
Otra forma de sumar:
let sumatoria = 0;
personas.forEach(({ cantidadDeLIbros }) => sumatoria += cantidadDeLIbros);
console.log(`Otra forma de sumar diferente: ${sumatoria} libros`);
Puntos claves para comprender reduce:
var output = array.reduce(tuFuncion, valorInicial)
Una cosa que no se dijo es que si no se especifica el valor inicial del acumulador este toma el valor del elemento en el index 0 del array y el valor del current value (cada elemento del array) sera el del elemento en index 1
var myArr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const suma = myArr.reduce( (accumulator, currrentValue) => currrentValue + accumulator );
console.log(suma);
//Expected output: 55//
Y asi pueden hacer otras operaciones
También se puede usar así:
var totalDeLibros = personas.reduce((acum, {cantidadDeLibros}) => acum + cantidadDeLibros, 0);
Pero en este caso solo lo recomiendo si ya son senior en javascript porque es bastante confuso de leer
El método reduce la matriz a un solo valor.
El método ejecuta una función proporcionada para cada valor de la matriz.
El valor de retorno de la función se almacena en un acumulador (resultado / total).
Nota: este método no cambia la matriz original.
cada vez que pasa la función a una arrow function me pierdo. Este curso se esta volviendo muy frustrante.
var sacha = {
nombre: 'Sacha',
apellido: 'Lifszyc',
altura: 1.72,
cantida_de_libros:110
}
var alan = {
nombre: 'Alan',
apellido: 'Perez',
altura: 1.86,
cantida_de_libros:90
}
var martin = {
nombre: 'Martin',
apellido: 'Gomez',
altura: 1.85,
cantida_de_libros:124
}
var dario = {
nombre: 'Dario',
apellido: 'Juarez',
altura: 1.71,
cantida_de_libros:35
}
var vicky = {
nombre: 'Vicky',
apellido: 'Zapata',
altura: 1.56,
cantida_de_libros:90
}
var paula = {
nombre: 'Paula',
apellido: 'Barros',
altura: 1.76,
cantida_de_libros:85
}
const reducer = (acum,persona)=>{
return acum+persona.cantida_de_libros
}
var totalDeLibros=personas.reduce(reducer,0) // como parametro el nombre deun funcion, el valor inicial de un valor
console.log(`en total todos tienen ${totalDeLibros} libros`)
Ejemplos de todos los temas vistos sobre arreglos, no duden en preguntar 😃:
var personas = [
{ name: 'Diego', lastName: 'Gomez', age: 28, projects: 3 },
{ name: 'Pedro', lastName: 'Mendez', age: 17, projects: 10 },
{ name: 'Vicky', lastName: 'Moreno', age: 23, projects: 5 },
]
// ForEach
// Imprimimos cada elemento
const printPersonAge = ({ name, age }) => console.log(`${name} tiene ${age} años de edad`)
personas.forEach(printPersonAge)
// Map
// Cambiamos la edad de años a meses y despues imprimimos cada elemento
const MONTHS = 12
const printPerson = persona => console.log(persona)
const ageToMonths = persona => ({ ...persona, age: persona.age * MONTHS })
personas.map(ageToMonths).forEach(printPerson)
// Filter
// Filtramos primero y despues imprimimos cada elemento
const LEGAL_AGE = 18
const isLegalAge = ({ age }) => age >= LEGAL_AGE
const printPersonInLegalAge = ({ name, age }) => console.log(`${name} tiene ${age} años de edad y es mayor de edad`)
personas.filter(isLegalAge).forEach(printPersonInLegalAge)
// Reduce
// Contamos la cantidad total de projects que cada persona tiene
const INICIO = 0
const reducer = (acum, { projects }) => acum + projects
const totalOfProjects = personas.reduce(reducer, INICIO)
console.log(`En total todos tienen ${totalOfProjects} projectos`)
Haganse un favor a la vista y usen console.table() en vez de console.log() 😃
Es un poco ambiguo que no explique que la funcion utiliza 4 argumentos, y de los cuales 2 son opcionales.
Principalmente confunde cuando la funcion reducer no recibe los parametros en el mismo orden que se los manda.
class Persona {
constructor(n, c, a, l){
this.n = n; // nombre
this.c = c; // ciudad
this.a = a; // altura
this.l = l; // libros
}
}
var personas = [];
personas.push(new Persona('Paula', 'Quito', 170, 64));
personas.push(new Persona('Miguel', 'Barcelona', 172, 71));
personas.push(new Persona('Celia', 'Bogota', 182, 129));
personas.push(new Persona('David', 'Puebla', 168, 16));
personas.push(new Persona('Daniela', 'Cordoba', 165, 86));
personas.push(new Persona('Guille', 'Cadiz', 178, 115));
personas.push(new Persona('Olga', 'Durazno', 162, 94));
const reductor = (acumulador, {l}) => acumulador + l;
var biblioteca = personas.reduce(reductor, 0);
console.log('En total todos tienen ' + biblioteca + ' libros');
reduce() sirve para seleccionar solo un valor de array
Una clase muy interesante, no obstante si coloco la variable antes que la función, el navegador me arroja un error, no se si estoy equivocado, pero se supone que las funciones se pueden colocar en cualquier parte del código sin importar el orden, ya que son cargadas en memoria RAM.
De está manera, me da como resultado error.
var totalBooks = people.reduce(bringingBackTotalBooks, 0);
const bringingBackTotalBooks = (acum, {quantityBooks}) => acum + quantityBooks;
console.log(`En total todos tienen ${totalBooks} libros.`);
Pero si re-organizo el código no arroja sintaxError
const bringingBackTotalBooks = (acum, {quantityBooks}) => acum + quantityBooks;
var totalBooks = people.reduce(bringingBackTotalBooks, 0);
console.log(`En total todos tienen ${totalBooks} libros.`);
Añado algunos ejemplos con tipos de dato primitivos
//Datos
var Axel = {
Nombre: 'Axel',
Apellido: 'López',
Altura: '1.65',
Libros: 10
}
var Karen = {
Nombre: 'Karen',
Apellido: 'Santamaria',
Altura: '1.70',
Libros: 13
}
var Jesus = {
Nombre: 'Jesus',
Apellido: 'Magaña',
Altura: '1.80',
Libros: 2
}
var Tania = {
Nombre: 'Tania',
Apellido: 'Rabadan',
Altura: '1.60',
Libros: 5
}
//Arreglo
var Personas = [Axel, Karen, Jesus, Tania]
for (var i = 0; i < Personas.length; i++) {
var persona = Personas[i];
console.log(`${persona.Nombre} mide ${persona.Altura} metros.`)
}
//ejemplo con valores primitivos
var numeros = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
//-------filter
//Para filtrar se necesitan dos cosas, los datos y una condicion o criterio.
//Criterio
//const esAlta = persona => persona.Altura>=1.7
const esAlta = ({ Altura }) => Altura >= 1.7
//filtrado
var personasAltas = Personas.filter(esAlta) //Filter devuelve un arreglo nuevo, sin tocar el de origen
//console.log(personasAltas)
//Reto
const esBajo = ({ Altura }) => Altura < 1.7
var personasBajas = Personas.filter(esBajo)
//console.log(personasBajas)
//filter con valores primitivos
const esPar = (numero) => numero % 2 === 0 // "Reciduo" un numero es par cuando al dividirlo entre 2 su reciduo es 0
var numerosfiltrados = numeros.filter(esPar)
//console.log(numerosfiltrados)
//-------map
//devolvera un nuevo array en el cual va a modificar cada uno de los elementos del array original.
//Pasar de metros a centimetros
const pasarAlturaACms = persona => {
//Este segmento alterara el objeto original
//persona.Altura *= 100
//return persona
//Este segmento generara un objeto nuevo
return {
...persona,
Altura: persona.Altura * 100
}
}
var personaCms = Personas.map(pasarAlturaACms)
//console.log(personaCms)
//map con valores primitivos (en este caso la funcion map siempre devolvera un nuevo elemento y el original se respetara)
const xDos = numero => numero *= 2
var numerosx2 = numeros.map(xDos)
//console.log(numerosx2)
//-----reduce
const reducer = (acum, { Libros }) => acum + Libros
var totaldeLibros = Personas.reduce(reducer, 0) //(funcion redutora, acum)
console.log(totaldeLibros)
//ejemplo con valores primitivos
const reduNum = (acum, numero) => acum + numero
const sumaAll = numeros.reduce(reduNum, 0)
console.log(sumaAll)
var isay = {
nombre : 'Isay',
apellido : 'Gonzalez',
altura: 1.68,
libros: 162
}
var ivania = {
nombre : 'Ivania',
apellido : 'Rivera',
altura: 1.62,
libros: 150
}
var marco = {
nombre : 'Marco',
apellido : 'Ponce',
altura: 1.81,
libros: 102
}
var cris = {
nombre : 'Cris',
apellido : 'Martinez',
altura: 1.66,
libros: 200
}
var svetlana = {
nombre : 'Svetlana',
apellido : 'Pustova',
altura: 1.61,
libros: 205
}
var personas = [isay, ivania, marco, cris, svetlana];
//Para sumar la cantidad de libros de todas las personas podemos hacerlo de la siguiente manera
var acum = 0
for (i = 0; i < personas.length; i++){
acum = acum + personas[i].libros;
}
console.log(`El número total de libros sumados con el ciclo for es de ${acum}`)
const reducer = (acum, {libros}) => acum + libros
//Tenemos otra manera de escribirlo y es con Reduce
//Su función es reducir todo el array a un valor
var totalDeLibros = personas.reduce(reducer, 0)
console.log(`El número total de libros sumados con reduce es de ${acum}`)```
No entiendo bien, no se si estare medio seteado con otros lenguajes,¿ cómo la reducerla función reducer recibe dos parámetros y en el reduce no le indicamos ninguno?
Hola compañeritos, recordemos que el acumulador se ejecuta sobre cada elemento que tengamos, y empieza tomando el valor del primer elemento, a menos que declaremos su valor en 0 o el número que deseemos.
const sum = numbers.reduce((accumulator, currentValue) => {
return accumulator + currentValue;
} 0);
Tambien podemos usar reduce en aplicaciones practicas, no pensemos el acumulador solo como una variable a la que iremos sumando cosas, sino, como una variable que va recorriendo cada elemento de tu array.
let vals = [5, 4, 1, 2, 9};
function findMax (acc, val) {
if (val > acc) {
acc = val;
}
return acc
}
let biggest = vals.reduce(findMax)
// Podemos reducir todo eso a esto
let biggest = vals.reduce((a, b) => a > b ? a : b)
console.log(biggest)
AYUDA
con el ciclo FOR, acum se le asignó un 0 (cero)… pero con el método reduce** no entendí en que momento se le asigna un valor a acum **
no entendi, alguien me da un ejemplo mas practico?
Mi aporte para esta clase, tomando en cuenta algunos aspectos de otros compañeros
// ES6 permite crear la definición de clases
class Persona {
// Constructor de la clase
constructor(nombre, apellidos, altura, libros) {
this.nombre = nombre
this.apellidos = apellidos
this.altura = altura
this.libros = libros
}
}
var personas = []
// Empujo a mi arreglo nuevos objetos de la clase persona
personas.push(new Persona('Alejandro', 'González Reyes', 1.72, 10))
personas.push(new Persona('Fernanda', 'Flores Castillo', 1.50, 2))
personas.push(new Persona('Virginia', 'Moreno Valle', 1.55, 33))
personas.push(new Persona('Paula', 'Mondragón Figueroa', 1.75, 15))
personas.push(new Persona('Daniela', 'Popoca Samaniego', 1.77, 7))
personas.push(new Persona('María Daniela', 'Reyes Reyes', 1.47, 28))
personas.push(new Persona('Mateo', 'González Villareal', 1.71, 2))
console.log(personas)
var totalAlturas = 0
// Conocer el total de alturas de todas las personas
for(var persona of personas) {
totalAlturas += persona.altura
}
console.log(`La suma de todas las alturas es ${totalAlturas}`)
// 2- FUnciones reductoras
// Estas retornan la operación que afectan directamente al acumulador
var funcionReductora = (acumulador, persona) => {
return acumulador + persona.libros
}
var funcionReductora = (acumulador, persona) => acumulador + persona.libros
var funcionReductora = (acumulador, { libros }) => acumulador + libros
// 1- Otra forma de obtener información globalizada a partir de los elementos de un arreglo es mediante un REDUCER. El método reduce() ejecuta una función reductora sobre cada elemento de un array, devolviendo como resultado un único valor. Este acepta como parámetro la función reductora y la cantidad inicial del acumulador
var totalLibros = personas.reduce(funcionReductora, 0)
console.log(`El total de libros es ${totalLibros}`)
// La función reductora recibe 4 parámetros. El acumulador, el valor actual (elemento), el índice actual (posición que ocupa en el arreglo el elemento actual, así como todo el array)
var funcionReductoraPromedioLibros = (acumulador, { libros }, index, array) => {
if((array.length - 1) === index) {
return (acumulador + libros) / array.length
} else {
return (acumulador + libros)
}
}
var PromedioLibros = personas.reduce(funcionReductoraPromedioLibros, 0)
console.log(`El promedio de libros es ${PromedioLibros}`)
This topic was quite difficult because he use of function is confuse, but wen I watch more times, i could do it!
El método reduce() nos permite reducir, mediante una función que se aplica a cada uno de los elemento del array, todos los elementos de dicho array, a un valor único.
//Contar cuantos libros en total tienen todos
//Asignar nombres y cantidad de libros (crear los objetos)
var nombres = ["Ulises", "Wendy", "Arantza", "Pau", "Brenda", "Leonel", "Jessy", "Sol", "Ian", "Rubén"];
var personas = [];
var minimoLibros = 20;
var maximoLibros = 70;
const cantidadDeLibros = () => parseInt(Math.random() * (maximoLibros-minimoLibros) + maximoLibros);
for(var i = 0; i< nombres.length; i++)
{
personas.push({nombre: nombres[i], libros: cantidadDeLibros()})
}
//Contar todos los libros
const contarLibros = (contador, personas) => contador + personas.libros
var contador = 0;
const totalLibros = personas.reduce(contarLibros,0)
console.log(totalLibros);
console.log(personas);```
Wow, la verdad tuve que verlo un par de veces más para que estuviera claro. Está muy interesante lo que se puede hacer con reduce.
En mi caso, para aplicar el reduce, calcule el promedio de edad familiar.
//reducir un array a un valor
var cristian = {
nombre: 'Cristian',
apellido: 'Perez',
edad: 30,
}
var angel = {
nombre: 'Angel',
apellido: 'Perez',
edad: 51,
}
var patricia = {
nombre: 'Patricia',
apellido: 'Perez',
edad: 50,
}
var daniela = {
nombre: 'Daniela',
apellido: 'Perez',
edad: 26,
}
var antonella = {
nombre: 'Antonella',
apellido: 'Perez',
edad: 26,
}
//creamos la arrow function para sumar edades
const sumador = (acum, {edad}) => acum + edad;
//creamos un array
var familia =[cristian,angel,patricia,daniela,antonella];
// creamos una variable que contendra nuestro promedio de edad y llamamos a la funcion reduce, que pide como parametros la funcion y la inicializacion del contador.
var PromedioDeEdad = (familia.reduce(sumador,0)) / familia.length;
//imprimimos el promedio de edad familiar
console.log(`El promedio de edad familiar es ${PromedioDeEdad} años`);```
Esta función no la conocía
Guarde en una variable el promedio de libros que tiene cada persona jajaj
let aidan = {
nombre: 'Aidan',
apellido: 'Cloquell',
cantidadDeLibros: 5
}
let eugenia = {
nombre: 'Eugenia',
cantidadDeLibros: 2
}
let miquel = {
nombre: 'Miquel',
apellido: 'Muntaner',
cantidadDeLibros: 5
}
let personas = [aidan, eugenia, miquel]
let cantidadPersonas = personas.length
const reducer = (acum, persona) => {
return acum + persona.cantidadDeLibros
}
let totalDeLibros = personas.reduce(reducer, 0)
let promedioLibros = totalDeLibros / cantidadPersonas
/*
El método reduce() nos permite reducir, mediante una función que se aplica a cada uno de los elemento del array, todos los elementos de dicho array, a un valor único.
*/
var sasha = {
nombre: 'Felipe',
apellido: 'Salamanca',
altura: 1.72,
cantidadDeLibros: 111
}
var alan = {
nombre: 'Alan',
apellido: 'Gomez',
altura: 1.85,
cantidadDeLibros: 78
}
var martin = {
nombre: 'Martin',
apellido: 'Gomez',
altura: 1.82,
cantidadDeLibros: 132
}
var dario = {
nombre: 'Dario',
apellido: 'Juarez',
altura: 1.71,
cantidadDeLibros: 90
}
var vicky = {
nombre: 'Vicky',
apellido: 'Zapata',
altura: 1.59,
cantidadDeLibros: 91
}
var paula = {
nombre: 'Paula',
apellido: 'Barrios',
altura: 1.65,
cantidadDeLibros: 182
}
// En este ejercicio usaremos la funcion reduce() para contabilizar la cantidad total de libros que tiene cada objeto (persona). reduce() lo que hace es reducir la cantidad de objetos (personas) a un total.
var personas = [sasha, alan, martin, dario, paula, vicky];
var acum = 0;
for (var i = 0; i < personas.length; i++) { // Este for nos devolvera la cantidad total de libros.
acum = acum + personas[i].cantidadDeLibros
}
console.log('En total, todos tienen ' + acum + ' libros');
// El ejemplo anterior es correcto sin embargo presentamos otra forma de obtener el mismo resultado.
/*
const reducer = (acumu, person) => {
return acumu + person.cantidadDeLibros;
}
*/
//const reducer = (acumu, person) => acumu + person.cantidadDeLibros; //Funcion que devuelve un valor.
const reducer = (acumu, { cantidadDeLibros }) => acumu + cantidadDeLibros;
var totalDeLibros = personas.reduce(reducer, 0); // Para reducir necesitamos dos cosas, una funcion llamada reducer y el valor inicial del acumulador que sera 0.
console.log('En total, todos tienen ' + totalDeLibros + ' libros');
Excelente Clase
const reducer = (acum, { cantidadDeLibros }) => acum + cantidadDeLibros;
var totalDeLibros = personas.reduce(reducer,0);
console.log(totalDeLibros)
Siempre aprendiendo algo con estas estupendas clases
metodos para arrays: filter, map, reduce
filter: selecciona los elementos de un array basado en un condicion
conticion{
un booleano
}
ejemplo: array.filter(condicion)
basado en esto se elijira si la posicion del array se filtra o no
map: genera otro array modificando una o varias propiedades, basado
en una indicacion a seguir
ejemplo: array.map(indicacion)
donde es una buena practica escribir la indicacion a parte
reduce: devuelve un valor el cual sera representativo del array
las exigencias del problema, puede ser la manera rapida de saber
la suma de una caracteristica numerica de un grupo de objetos
-A diferencia de los otros dos metodos, este tiene dos parametros:
una funcion y un acumulador (el nombre de este es “acum” por defecto)
la funcion se puede llamar como se desee
ejemplo array.reduce(reducer, acum)
es buena practica escribir a parte la funcion
usando el reducer
var karlxs = {
nombre: 'KalrxS',
apellido: 'Guzman',
altura: 1.76,
cantidadLibros:111
}
var alan = {
nombre: 'Alan',
apellido: 'Perez',
altura: 1.86,
cantidadLibros:78
}
var martin = {
nombre: 'Martin',
apellido: 'Gomez',
altura: 1.85,
cantidadLibros:132
}
var dario = {
nombre: 'Dario',
apellido: 'Juarez',
altura: 1.71,
cantidadLibros:90
}
var vicky = {
nombre: 'Vicky',
apellido: 'Zapata',
altura: 1.56,
cantidadLibros:91
}
var paula = {
nombre: 'Paula',
apellido: 'Barros',
altura: 1.72,
cantidadLibros:182
}
//otra forma
// var acum = 0
// for ( var i = 0; i< personas.length;i++){
// acum += personas[i].cantidadLibros
// }
const reducer = (acum, {cantidadLibros}) => acum += cantidadLibros
var totalLibros = personas.reduce(reducer, 0)
console.log(`En total tienen ${totalLibros} libros`)
la funcion que hacemos de reducer, no retorna valores hasta haber terminado de iterar todo el arreglo
const reducer = (acum,{cantidadLibros}) => {
// += ó + , es opcional ya que mantiene el valor dentro hasta que se mande el return
return acum += cantidadLibros
}
var totalLibros = personas.reduce(reducer,0)
console.log(totalLibros)
var juan =
{
nombre: 'jose',
estatura: 1.5
}
var pedro =
{
nombre: 'pedro',
estatura: 1.6
}
var maria =
{
nombre:'maria',
estatura: 1.7
}
var andres =
{
nombre: 'andres',
estatura: 1.8
}
var rafa =
{
nombre: 'rafa',
estatura: 1.9
}
var donatelo =
{
nombre: 'donatelo',
estatura: 2
}
var personas = [juan,pedro,maria,andres,rafa,donatelo]
//funcion cambiando valor y devolviendo un nuevo objeto
const modificarAltura = objeto => {
return{
...objeto,
estatura : objeto.estatura * 100
}
}
// funcion filtrar altos
const Altos = objeto => objeto.estatura > 170;
const sumatoria = (acumulador,objeto) => objeto.estatura + acumulador;
var nuevaEstatura = personas.map(modificarAltura);
var personasAltas = nuevaEstatura.filter(Altos)
var sumar = personas.reduce(sumatoria,0)
console.log(sumar)
console.log(personas);
console.log(nuevaEstatura);
console.log(personasAltas);
for (var i=0; i<= personas.length; i++)
{
var recorrer = personas[i];
if (personas[i].estatura > 1.7){
console.log( personas[i].nombre + ' persona alta')
}
}
Genial!!!
Alguien me podría ayudar haciendo este ejercicio?
Realice un script que transforme el siguiente array,
a= [1,1,1,2,2,2,2,3,3,3]
en { “1” => 3, “2” =>4 , “3” => 3}
Muy interesante, como se pule el código al utilizar este método.
Buen método el reduce()
Tuve que buscar fuentes externas para entender completamente este tema, pero en general muy bueno el ejemplo
var gustavo = {
nombre: "Gustavo",
apellido: "Tiseira",
edad: 30,
altura: 1.8,
cantidadDeLibros: 150
};
var alan = {
nombre: "alan",
apellido: "Perez",
edad: 32,
altura: 1.72,
cantidadDeLibros: 260
};
var martin = {
nombre: "Martin",
apellido: "Gomez",
edad: 56,
altura: 1.98,
cantidadDeLibros: 50
};
var vicky = {
nombre: "Vicky",
apellido: "Sotto",
edad: 29,
altura: 1.78,
cantidadDeLibros: 236
};
var paula = {
nombre: "Paula",
apellido: "Diez",
edad: 33,
altura: 1.68,
cantidadDeLibros: 155
};
var personas = [gustavo, alan, martin, vicky, paula];
/* Lograr sumar todos los libros con for */
var acum = 0;
for (var i = 0; i < personas.length; i++) {
acum = acum + personas[i].cantidadDeLibros;
}
console.log(
`1 - La cantidad de libro que tienen entre todas las personas es ${acum}`
);
/* Esta funcion recibe 2 parametros:
1. El acumulador
2. Cada uno de los elementos */
/* const reducer = (acum, persona) => {
return acum + persona.cantidadDeLibros;
}; */
/* const reducer = (acum, persona) => acum + persona.cantidadDeLibros; */
const reducer = (acum, { cantidadDeLibros }) => acum + cantidadDeLibros;
/* reducer = funcion, valor inicial del acumulador */
var totalDeLibros = personas.reduce(reducer, 0);
console.log(
`2 - La cantidad de libro que tienen entre todas las personas es ${totalDeLibros}`
);
var jhon = {
'name': 'Jhon',
'last_name': 'Romero',
'height': 1.69,
'cantidadDeLibros': 155,
}
var dario = {
'name': 'Dario',
'last_name': 'Susnisky',
'height': 1.45,
'cantidadDeLibros': 155,
}
var susana = {
'name': 'Susana',
'last_name': 'Guaman',
'height': 1.29,
'cantidadDeLibros': 155,
}
var gabriela = {
'name': 'Gabriela',
'last_name': 'Lifty',
'height': 1.50,
'cantidadDeLibros': 155,
}
var alberto = {
'name': 'Alberto',
'last_name': 'Guarnizo',
'height': 1.8,
'cantidadDeLibros': 150
}
var alan = {
'name': 'Alan',
'last_name': 'Cevallos',
'height': 1.72,
'cantidadDeLibros': 260
}
var martin = {
'name': 'Martin',
'last_name': 'Hernandez',
'height': 1.98,
'cantidadDeLibros': 50
}
var victoria = {
'name': 'Victoria',
'last_name': 'Medina',
'height': 1.78,
'cantidadDeLibros': 236
}
var maria = {
'name': 'María',
'last_name': 'Suarez',
'height': 1.68,
'cantidadDeLibros': 155
}
var people = [jhon, dario, susana, gabriela, alberto, alan, martin, victoria, maria]
// var acum = 0
// for (let i = 0; i < people.length; i++) {
// acum += people[i].cantidadDeLibros
// }
const reducer = (acum, { cantidadDeLibros }) => acum += cantidadDeLibros
var totalDeLibros = people.reduce(reducer, 0)
console.log(`En total todos tienen ${totalDeLibros} ${totalDeLibros === 1 ? 'libro' : 'libros'}`)
Muy buena información!
let totalDeLibros = personas.reduce((acum, {cantidadDeLibros}) => {
return acum + cantidadDeLibros
}, 0)
Se me hizo un poco confuso todo esto, le encuentro mas sentido usar la sintaxis del for, pero esos son mis gustos, puede que sea mas eficiente de esta forma a la hora de ahorrar memoria.
var totalDeLibros = personas.reduce((total, persona) => total + persona.libros, 0);
En este punto tenemos que la funcion resive dos prametros, qu seria el valor "acum" el cual supongo que corresponde al valor que queremos que guarde el total de los libros a medida que vamos navegando por los objetos!
funy code
var saul ={
nombre: "saul",
apellido: "solis",
altura:1.72,
cantidadDelibros: 60
}
var andrea ={
nombre:"andrea",
apellido:"ortiz",
altura:1.62,
cantidadDelibros: 70
}
var ariel={
nombre:"ariel",
apellido:"castro",
altura: 1.70,
cantidadDelibros: 50
}
var samuel={
nombre:"samuel",
apellido: "garcia",
altura:1.52,
cantidadDelibros: 32
}
var isabela ={
nombre: "isabela",
apellido:"ezpinoza",
altura: 1.22,
cantidadDelibros: 12
}
const esAlta = ({altura}) => altura > 1.69
var personas= [saul, ariel,andrea,samuel,isabela]
var personasAltas = personas.filter(esAlta)
var pasarAlturaAcms = persona =>({
...persona,
altura: persona.altura *100
})
var personasCms = personas.map(pasarAlturaAcms)
const reducer = (acum, persona) => acum + persona.cantidadDelibros
var totalDeLibros = personas.reduce(reducer, 0)
console.log(`En total todos tienen ${totalDeLibros} libros`)
console.log(personasCms)
var jose ={
name: `Jose`,
age: 22
}
var maria ={
name: `Maria`,
age: 23
}
var juan ={
name: `Juan`,
age: 18
}
var carlos ={
name: `Carlos`,
age: 17
}
var pedro ={
name: `Pedro`,
age: 15
}
var lista = [jose, maria, juan, carlos, pedro];
const suma = (x, lista) => {
return x + lista.age
}
var edadDeLista = lista.reduce(suma, 0);
console.log (`El total de edad de la lista ${edadDeLista}`);```
excelente clase de como utilizar reduce, dejo mis notas
<clase20.js>
var Daniel = {
nombre: `Daniel`,
apellido: `Dominguez`,
altura: 1.82,
cantidadDeLibros: 20
}
var Paula = {
nombre: `Paula`,
apellido: `Torres`,
altura: 1.70,
cantidadDeLibros: 17
}
var Juan = {
nombre: `Juan`,
apellido: `Lopez`,
altura: 2.00,
cantidadDeLibros: 2
}
var Arturo = {
nombre: `Arturo`,
apellido: `Tello`,
altura: 1.75,
cantidadDeLibros: 14
}
var Diana = {
nombre: `Diana`,
apellido: `Medina`,
altura: 1.60,
cantidadDeLibros: 10
}
var personas = [Daniel, Paula, Juan, Arturo, Diana];
const pasarAlturaACms = persona => ({
...persona,
altura:persona.altura * 100
})
var personasCms = personas.map(pasarAlturaACms);
//var acum = 0;
//for (var i = 0; i < personas.length; i++){
// acum = acum + personas[i].cantidadDeLibros
//}
//console.log(`En total todos tienen ${acum} libros`);
const reducer = (acum , {cantidadDeLibros}) =>
acum +cantidadDeLibros
var totalDeLibros = personas.reduce(reducer , 0);
console.log(`En total todos tienen ${totalDeLibros} libros`);
Esta función de reduce me dejó algo loco jaja. 😀
var flavio = {
nombre:'flavio',
altura:1.70,
dinero: 100
}
var yaki = {
nombre:'yaki',
altura:1.60,
dinero: 350
}
var cesar = {
nombre:'cesar',
altura:1.75,
dinero:120
}
var ana = {
nombre:'ana',
altura:1.50,
dinero:350
}
var personas = [yaki,flavio,cesar,ana]
/* var acum = 0
for (var i = 0; i < personas.length; i++) {
acum += personas[i].dinero
}
console.log('en total hay ' + acum + ' soles');
forma mas comun */
const reducir = (acum, {dinero}) => acum + dinero
var totalDeDinero = personas.reduce(reducir, 0)
console.log('en total hay ' + totalDeDinero + ' soles');
var juan = {
nombre: 'Juan',
apellido: 'Hernandez',
altura: 1.73,
cantidadDeLibros: 91
}
var leon = {
nombre: 'Leon',
apellido: 'Sosa',
altura: 1.70,
cantidadDeLibros: 181
}
var mare = {
nombre: 'Marelys',
apellido: 'Hernandez',
altura: 1.69,
cantidadDeLibros: 175
}
var oswald = {
nombre: 'Oswaldo',
apellido: 'Lacruz',
altura: 1.76,
cantidadDeLibros: 111
}
const reducer = (acum,{cantidadDeLibros}) => acum + cantidadDeLibros
var totalDeLibros = personas.reduce(reducer,0)
console.log(`En total todos tienen ${totalDeLibros} libros`)
const reducer = (acum, { cantidadDeLibros }) => acum + cantidadDeLibros
//Funcion y valor inicial del acumulador
var totalDeLibros = personas.reduce(reducer, 0)
console.log(`En total todos tienen ${ totalDeLibros } libros`)
var cantidad = (acumulador, { libros }) => acumulador + libros;
var totalLibros = personas.reduce(cantidad, 0);
console.log(`el total de libros es ${totalLibros}`);
< var ronald = {
nombre: "ronald",
apellido: "aguirre",
altura: 1.72,
cantidadlibros: 13,
}
var fernanda = {
nombre: "fernanda",
apellido: "ortiz",
altura: 1.65,
cantidadlibros: 10,
}
var juan = {
nombre: "juan",
apellido: "ortiz",
altura: 1.25,
cantidadlibros: 7,
}
var personas = [ronald, fernanda, juan]
// var acum = 0
// for (var i = 0; i < personas.length; i++){
// acum = acum + personas[i].cantidadlibros
// }
const reducer = (acum, persona) =>{
return acum + persona.cantidadlibros
}
var totalDeLibros = personas.reduce(reducer, 0)
console.log(`En total todos tienen ${acum} libros`);>
Buen ejemplo.
Seguimos con el curso, ojalá sigamos practicando reduce como lo hemos hecho con los demás temas.
Revisen este link Reduce Mozilla
Con reduce pueden hacer cosas bien locas
const newArray = persons.reduce((acumulador, person) => {
if(person.height >= 1.70) {
var newPerson = {...person, height: person.height*100}
acumulador.push(newPerson)
}
return acumulador
},[])
En vez de poner 0 puse un array vacío porque eso le indica al acumulador que su valor inicial es un array. Esto también se puede hacer usando las funciones de filter y map.
Entonces el newArray retornaría
[
{name:"mauro", lastname: "quinteros", height: 175},
{name:"camila", lastname: "paredes", height: 170}
]
no entiendo para que colocmaos el acum al hacer el arrow function , si no esta definido en ningun lado
Otro ejemplo de la función Reduce:
var persona1 = {
nombre: "Manuel",
apellido:"R",
altura:1.76,
cantidadDeLibros:91
}
var persona2 = {
nombre: "Mama",
apellido:"G",
altura:1.66,
cantidadDeLibros:80
}
var persona3 = {
nombre: "Rosalinda",
apellido:"B",
altura:1.66,
cantidadDeLibros:150
}
var persona4 = {
nombre: "mariana",
apellido:"R",
altura:1.86,
cantidadDeLibros:100
}
//arreglo
var personas=[persona1,persona2,persona3,persona4];
const reducer = (acum,persona)=>acum + persona.cantidadDeLibros;
var totaldeLibros = personas.reduce(reducer,0);
console.log(`en total todos tienen ${totaldeLibros} libros`);```
const reducer = (acum, {cantidadDeLibros} ) => acum + cantidadDeLibros
var toltalLibros = personas.reduce(reducer, 0)
console.log(toltalLibros)
<//metodo map()
const myarray = [3, 2, 1];
/*const nuevoarray = myarray.map(function(current){
return current * 2;
});*/
//modificamos mejor el codigo con un arrow function
const nuevoarray = myarray.map((num) => num * 2);
console.log('nuevo', nuevoarray);
console.log('original', myarray);
//el metodo map no modifica el original>
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?