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()
Viendo ahora - 55

Filtrado y reducción con filter() y reduce()
11:34 min - 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
Iteración con map() y forEach()
Resumen
¿Qué son los métodos .map() y .forEach() en JavaScript?
En el mundo de la programación, conocer los métodos de iteración de arrays en JavaScript es esencial para escribir código limpio y eficiente. En esta ocasión, exploramos los métodos .map() y .forEach(), herramientas poderosas que te permiten manipular y recorrer arrays sin alterar el array original. Mientras que .map() está diseñado para generar un nuevo array basado en el procesamiento de cada elemento, .forEach() ejecuta una función proporcionada pero sin generar un nuevo array. Descubramos cómo funcionan estos métodos con ejemplos prácticos.
¿Cómo se utiliza .map()?
El método .map() es altamente utilizado en JavaScript para procesar cada elemento de un array y generar un nuevo array con los resultados. Su sintaxis simplificada y funcionalidad robusta lo convierten en una opción frecuente para transformar datos con facilidad.
const numbers = [1, 2, 3, 4, 5]; const squaredNumbers = numbers.map(num => num * num); console.log(numbers); // Output: [1, 2, 3, 4, 5] console.log(squaredNumbers); // Output: [1, 4, 9, 16, 25]
En este ejemplo, los números del array se elevan al cuadrado, resultando en un nuevo array squaredNumbers sin modificar el original.
¿Cómo implementamos .forEach()?
El método .forEach(), por otro lado, es ideal para ejecutar funciones en cada elemento de un array sin preocuparse por el retorno de un nuevo array. Este método es útil cuando deseas realizar alguna acción basada en los elementos del array, pero no necesitas un nuevo conjunto de resultados.
const colors = ['red', 'pink', 'blue']; colors.forEach(color => console.log(color)); // Output: red pink blue
Aquí, cada color se imprime en la consola. Aunque la ejecución es visible, .forEach() simplemente itera sin devolver un array nuevo.
Aplicaciones prácticas de .map() y .forEach()
Conversión de temperaturas de Fahrenheit a Celsius
Supongamos que necesitamos convertir un conjunto de temperaturas de Fahrenheit a Celsius. Usamos .map() para aplicar la fórmula de conversión a cada elemento del array.
const fahrenheitTemps = [32, 68, 95, 212]; const celsiusTemps = fahrenheitTemps.map(fahrenheit => (5 / 9) * (fahrenheit - 32)); console.log(fahrenheitTemps); // Output: [32, 68, 95, 212] console.log(celsiusTemps); // Output: [0, 20, 35, 100]
Usamos .map() ya que queremos un nuevo array con las temperaturas convertidas a Celsius.
Suma de elementos en un array
Para sumar todos los elementos dentro de un array, podemos utilizar .forEach() para acumular los valores sin crear un nuevo array.
const numbers = [1, 2, 3, 4, 5]; let sum = 0; numbers.forEach(number => sum += number); console.log(`Array of numbers: [${numbers}]`); // Output: [1, 2, 3, 4, 5] console.log(`Sum of numbers: ${sum}`); // Output: 15
Aquí utilizamos .forEach() para recorrer el array y calcular la suma total de sus elementos.
Reflexiones sobre el uso adecuado de .map() y .forEach()
Comprender cuándo utilizar .map() o .forEach() puede optimizar tu código y ahorrar tiempo de ejecución:
- Usa
.map()cuando planees obtener un nuevo array derivado del original. - Emplea
.forEach()para realizar acciones o cambios sobre el elemento actual sin la necesidad de un nuevo array.
¡Ahora que conoces estas herramientas, te animamos a probarlas en tus propios proyectos! La mejor forma de aprender es aplicando, así que no dudes en experimentar y compartir tus experiencias.