Contenido del curso
Primeros Pasos
- 5

¡Hola Mundo!
06:13 min - 6

Anatomía de una variable
09:23 min - 7

Tipos de datos: Mutabilidad e inmutabilidad
10:55 min - 8

Paso por valor
11:06 min - 9

Paso por referencia
07:00 min - 10

Creación de strings
11:33 min - 11

Concatenación de strings
08:31 min - 12

Manipulación de strings
12:13 min - 13

Tipo de dato primitivo: number
09:30 min - 14

Conversión a Booleanos
05:08 min - 15

Tipos de datos primitivos: null, undefined, symbol y bigint
07:28 min - 16

Conversión de tipos: Type Casting y Coercion
04:38 min - 17

Conversión de tipos explícita e implícita
12:20 min - 18

Proyecto: Crea un perfil para redes sociales con JavaScript
07:23 min
Funciones y This
- 19

Anatomía de una función
11:39 min - 20

Preguntas a Desarrolladores Senior: ¿Por qué aprender Desarrollo Web?
02:11 min - 21

Funciones vs Métodos
10:01 min - 22

Funciones puras e impuras
11:22 min - 23

Identificador this
11:38 min - 24

Métodos bind, call y apply
10:09 min - 25

Funciones flecha y enlace léxico
10:31 min - 26

Implicaciones de duplicar código
03:19 min - 27

Funciones constructoras
10:41 min - 28

10 Tipos de funciones
01:39 min - 29

Objeto window y modo estricto
07:37 min - 30

Tipos de binding
01:11 min - 31

Expresiones vs Sentencias
04:02 min - 32

Proyecto: Crea biografías de personajes con JavaScript
12:51 min
Lógica y ciclos
- 33

Operadores de comparación
06:12 min - 34

Operadores lógicos
04:33 min - 35

Ejecución condicional: if
07:45 min - 36

Proyecto: Adivina el número
09:36 min - 37

Ejecución condicional: ternario
05:24 min - 38

Ejecución condicional: switch
12:08 min - 39

Loop: for
07:31 min - 40

Loop: forEach
03:57 min - 41

Loop: for of
04:26 min - 42

Loop: for in
07:38 min - 43

Loop: while
03:56 min - 44

Loop: do while
03:13 min - 45

Proyecto: Juego adivina la palabra
15:56 min
Fundamentos de arrays y modificación
- 46

Introducción a Arrays
09:09 min - 47

Mutabilidad e inmutabiliad de Arrays
07:56 min - 48

Modificación básica del final con push(), pop()
04:33 min - 49

Ejercicio: Stack de libros
16:03 min - 50

Modificación del principio con shift(), unshift()
10:21 min - 51

Modificación avanzada con splice(), reverse(), sort(), fill()
16:37 min - 52

Proyecto: Juego de cartas
15:37 min - 53

Preguntas a Desarrolladores Senior: Estrategias y métodos de estudio
01:10 min
Iteración de Arrays
- 54

Iteración con map() y forEach()
12:53 min - 55

Filtrado y reducción con filter() y reduce()
Viendo ahora - 56

Ejercicio: Calificación promedio aprobatoria
05:27 min - 57

Búsqueda de elementos con find() y findIndex()
03:52 min - 58

Ejercicio: Encuentra al ganador de una rifa
11:21 min - 59

Proyecto: Análisis de transacciones
10:55 min - 60

Proyecto: Análisis de transacciones parte 2
08:01 min
Métodos específicos y Operaciones
- 61

Unir y entrelazar con concat(), spread operator y join()
12:05 min - 62

Verificación y evaluación con every() y some()
05:15 min - 63

Métodos de búsqueda con includes(), indexOf() y lastIndexOf()
07:05 min - 64

Ejercicio: Encontrando los índices
11:09 min - 65

Crear copias con slice()
05:28 min - 66

Spread operator: casos de uso
07:11 min
Arrays multidimencionales
Clases y Objetos
- 71

Anatomia de un Objeto
06:48 min - 72

Trabajando con objetos
12:52 min - 73

Función constructora
14:31 min - 74

¿Qué es una clase?
06:17 min - 75

Prototipos y herencias
02:15 min - 76

Herencia en la práctica
15:38 min - 77

Prototipos en la práctica
10:42 min - 78

this en JavaScript
05:36 min - 79

Proyecto: Crea una red social
12:25 min - 80

Proyecto: Crea una red social parte 2
09:00 min
Filtrado y reducción con filter() y reduce()
Resumen
¿Qué son los métodos filter y reduce en JavaScript?
En programación, es esencial manipular y operar con Arrays de manera eficiente. JavaScript ofrece métodos poderosos como filter y reduce que no modifican el Array original, sino que crean un nuevo resultado basado en ciertas condiciones o cálculos. En esta guía, exploraremos cómo utilizar estos métodos para optimizar tu código y procesar datos de manera efectiva.
¿Cómo funciona el método filter?
filter es un método que recorre cada elemento de un Array y selecciona aquellos que cumplen con una condición específica. De este modo, se genera un nuevo Array con los elementos que pasaron el filtro.
Ejemplo práctico con números:
Imaginemos que tenemos un Array de números, y queremos extraer solo los números pares. Aquí te mostramos cómo hacerlo:
// Comentario: Inicializar el Array original const numbers = [2, 3, 4, 5, 6, 7, 8, 9, 10]; // Crear un nuevo array con solo números pares const evenNumbers = numbers.filter(number => number % 2 === 0); // Mostrar resultados console.log(numbers); // Array original: [2, 3, 4, 5, 6, 7, 8, 9, 10] console.log(evenNumbers); // Números pares: [2, 4, 6, 8, 10]
Con este código, filter verifica cada número del Array original para ver si es divisible por 2 sin un residuo, lo que identifica a los números pares.
¿Qué hace el método reduce?
El método reduce toma un Array y lo reduce a un solo valor usando una función acumulativa. Esta función recibe dos parámetros principales: un acumulador y el valor actual del Array.
Ejemplo de suma de números:
Para sumar todos los elementos de un Array, podemos utilizar el siguiente ejemplo:
// Inicializar un array de números const numbersReduce = [1, 2, 3, 4, 5]; // Reducir el array a un solo valor que es la suma de sus elementos const suma = numbersReduce.reduce((accumulator, currentValue) => accumulator + currentValue, 0); // Mostrar resultados console.log(numbersReduce); // Array original: [1, 2, 3, 4, 5] console.log(suma); // Suma de elementos: 15
En este código, la función de reduce itera sobre cada valor del Array, sumándolo al acumulador. El initialValue es 0, que representa el punto de partida de la suma.
Aplicación de reduce para contar palabras:
Otra aplicación práctica de reduce es encontrar la frecuencia de palabras en un Array de strings.
// Inicializar un array de palabras const words = ['apple', 'banana', 'hello', 'bye', 'banana', 'bye', 'bye']; // Reducir para contar la frecuencia de cada palabra const wordFrequency = words.reduce((accumulator, currentValue) => { if (accumulator[currentValue]) { accumulator[currentValue] += 1; } else { accumulator[currentValue] = 1; } return accumulator; }, {}); // Mostrar resultados console.log(wordFrequency); // Frecuencia: { apple: 1, banana: 2, hello: 1, bye: 3 }
En este ejemplo, reduce crea un objeto que cuenta cuántas veces aparece cada palabra en el Array, proporcionando una manera eficaz de medir la frecuencia de cada término.
Estos métodos no solo facilitan una programación más limpia y eficiente, sino que también son fundamentales al trabajar con grandes conjuntos de datos. Continúa practicando y explorando distintos usos para estos métodos en tus propios proyectos. ¡El aprendizaje no se detiene aquí!