Básicos de

Expresiones y Sentencias

Se le llama expresión a un fragmento de código que produce un valor y es el bloque de construcción más básico en JavaScript

100 + 200

Sentencias (declaraciones)

Otro bloque de construcción importante en JavaScript es la sentencia, que es una idea completa o una oración que le dice a la computadora que haga algo.

alert("Hola Mundo");

Los programas en JS constan de una serie de sentencias.

indicar a la computadora que mostrara un cuadro de diálogo con el texto Hello, world!

Las expresiones y las sentencias en JS se complementan entre sí:

Las expresiones tienen valores, pero por sí solas no hacen nada.
Las sentencias realizan acciones al indicar a la computadora que ejecute tareas, pero las sentencias en sí no tienen valores; son solo instrucciones.

El poder de la programación proviene de escribir sentencias que usen y manipulen los valores de las expresiones para lograr los resultados deseados.

Números y Operadores

JS utiliza el tipo de dato number para almacenar valores numéricos y operadores para cálculos matemáticos.

+ , - , * , / , **

Orden de las Operaciones

JS utiliza la regla matemática estándar PEMDAS (paréntesis, exponentes, multiplicación, división, suma, resta)

8 + 8 / 8 - 2; 

7

8 + (8 / 8) - 2; 

7

Punto Flotante

En JS el tipo de dato number admite enteros (integers) y números con punto decimal o floats

10 / 4
2.5

8 / 3
2.6666666666666665

Enlaces (Bindings)

Los lenguajes de programación te permiten asociar un nombre con un valor para poder referirte a valor facilmente más adelante en tu código. A esa asociación en JS se le llama enlace (binding) y sirven para almacenar los valores que generan tus expresiones.

Variables

Un tipo de enlace es la variable, que permite actualizar el valor asociado a un nombre según sea necesario.

Constantes

Otro tipo de enlace son las constantes, donde no puedes actualizar el valor asociado al nombre una vez que lo hayas asignado.

Variables

JS Tiene dos palabras clave (keyword) para declarar variables: var y let

Una palabra clave es una palabra integrada en el lenguaje de programación y por lo tanto está reservada para un propósito específico.

let edad;
undefined

let edad = 30;

edad;
30

let crea una nueva variable llamada edad. Una declaración con let por sí sola no tiene valor.

Escribimos una expresión para asignar un valor a la variable.

Constantes

Para declarar una constante en JavaScript, usamos la palabra clave const:

const PI = 3.141592653589793;

let diametro = 3;

let circunsferencia = diametro * PI;

circunsferencia;
9.42477796076938

Constantes

Para declarar una constante en JavaScript, usamos la palabra clave const:

const PI = 3.141592653589793;
PI = 5.378;

Uncaught TypeError: Assignment to constant variable.
  at <anonymous>:1:4

Constantes

Para declarar una constante en JavaScript, usamos la palabra clave const:

const PI;

Uncaught SyntaxError: Missing initializer in const declaration

Convenciones de Nombres

Debes dar a tus variables y constantes nombres descriptivos, de modo que cuando tú u otra persona lean tu código, quede claro qué representan
JavaScript distingue entre mayúsculas y minúsculas (case sensitive): edad, Edad y EDAD (son diferentes)
Los identificadores, no pueden contener espacios. Una convención es usar camelCase o snake_case
Para las constantes verdaderas, es habitual usar SNAKE_CASE en mayúsculas, como HORAS_EN_UN_DIA
Los identificadores no pueden empezar con números o caracteres raros

ejercicios

🧠 Ejercicio 1 — Orden de operaciones

let result = 8 + 4 * 2 - 6 / 3;
result;

Sin usar la consola, intenta predecir el resultado:

ejercicios

🛠 Ejercicio 2 — Encuentra y corrige el error

Const horasEnUnDia = 24;
lett minutos = 60
let total = horasEnUnDia * minutos * 60

horasEnUnDia = 25;

Este código tiene varios problemas:

Tu misión:

Encuentra todos los errores.
Corrige el código.
Explica por qué JS marca error.

ejercicios

📐 Ejercicio 3 — Fórmula matemática con variables

área = π * radio²

La fórmula para calcular el área de un círculo es:

Escribe un programa en JavaScript que:

Declare una constante PI
Declare una variable radius
Calcule el área usando una expresión
Guarde el resultado en una variable llamada area
Muestre el resultado en la consola

ejercicios

🏷 Ejercicio 4 — Nombres bien y mal definidos

let user name = "Carlos";
let 2speed = 80;
let velociadEnKmh = 100;
let velocidad_en_kmh = 120;
let velocidad = 90;
let edadActualDelUsuario = 28;

Tienes varios nombres de variables.
Indica cuáles son correctos y cuáles no, y explica por qué.

Luego:

Corrige los incorrectos.
Decide cuáles deberían ser const en lugar de let.
Explica cuándo usarías SNAKE_CASE en mayúsculas.

ejercicios

🚀 Bonus (si quieres subir nivel)

Escribe un pequeño programa que:

Declare una constante HOURS_IN_A_DAY
Declare una variable days y asigna el valor numerico entero que desees
Calcula cuántas horas hay en esos días.
Guarde el resultado en una variable con buen nombre en camelCase

Sin usar números sueltos. Todo debe estar declarado.

Comentarios

sirven para explicar cómo funciona el código, resaltar características importantes o tomar nota de algo que aún necesitas hacer, sin afectar la funcionalidad del programa.

// comentario de una línea

/*
	Comentario multi-línea
*/

Sumar y Restar

Operador de

incremento y decremento

let level = 5;

level++; // 6

level--; // 5

let level = 5;

level += 5; // 10

level -= 2; // 8

let level = 5;

level = level + 5; // 10

level = level - 2; // 8

Operador de

asignación con signo

Multiplicar y Dividir

Operador de

incremento y decremento

let points = 8;

// points = points * 4;
points *= 4;

// points = points / 2;
points /= 2;

Pruébalo

Usa el operador `*=` para observar el efecto del interés compuesto.

Imagina que tienes $200 y ganas un 5% de interés cada año.
¿Cuántos años te tomará duplicar tu dinero?

Para descubrirlo:

Crea una variable llamada investment e inicialízala con el valor 200.
Usa repetidamente el operador *= para multiplicar el valor por 1.05.
Cuenta cuántas veces necesitas aplicar la operación hasta que el valor alcance o supere 400.

ejercicio

🛠 Ejercicio 1 — Encuentra y corrige el error

let price = 200;

price -= 20;
price /= 1.16;
price += 16%;

Este código pretende aplicar un descuento y luego un impuesto:

¿Qué error hay en el código?
Corrige el cálculo para que:
- Primero aplique 20 pesos de descuento
- Luego aplique 16% de impuesto correctamente
¿Qué valor final debería tener price?

Cadenas de caracteres (Strings)

JS utiliza el tipo de dato string para representar texto. Se llama “cadena” porque el texto se trata como una secuencia (o cadena) de caracteres. Por ejemplo, la cadena Hola! está compuesta por cinco caracteres: H, o, l, a, !

String literal

Un literal de cadena es una representación directa de un valor de texto. Para crear uno, simplemente encierra el texto entre comillas dobles. Todo lo que esté entre las comillas forma parte de la cadena. Por ejemplo:

let message = "Bienvenido!";

message;

'Bienvenido!'

También puedes escribir cadenas usando comillas simples en lugar de dobles.

let description = "Producto #45";

description;

'Producto #45'

Incluso es posible tener una cadena que solo contenga números, como:

"789"

Sin embargo, el literal "789" es una secuencia de tres caracteres (7, 8 y 9), mientras que el número:

Tiene un valor numérico.

Unir cadenas

Cuando el operador + se aplica a cadenas en lugar de números las une (concatena). Así puedes construir mensajes más largos

let student = "Be";

let greeting = "Bienvenida";

let fullGreeting = greeting  + student;

fullGreeting;
'BienvenidaBe'

let student = "Be";

let greeting = "Bienvenida";

let fullGreeting = greeting  + " " + student;

fullGreeting;
'Bienvenida Be'

Obtener la longitud

A menudo necesitarás saber cuántos caracteres tiene una cadena. Para obtener la longitud de una cadena, usa la propiedad .length:

"xyz".length;
3

let tweet = "Estoy aprendiendo Javascript";
tweet.length;
28

Obtener un carácter específico

Para obtener un carácter individual de una cadena, utilizamos su índice, que representa su posición dentro de la cadena.

let language = "Javascript";
language[0];
'J'

language[4];
's'

ejercicios

🧠 Ejercicio 1 — Indexación y concatenación

let language = "Javascript";

Dado el siguiente código:

Obtén la J utilizando su indice
Obtén la s de igual manera
utiliza + para concatenar ambos caracteres

ejercicios

🛠 Ejercicio 2 — Refactoriza el código

let name = "Carlos";
let greeting = "Hola,";
let fullGretting = name + greeting;

Este código intenta construir este mensaje: 'Hola, Carlos' pero no está funcionando 😔

¿Qué problemas tiene?
corrígelos

ejercicios

🛠 Ejercicio 2 — Detecta el bug conceptual

let code = "123";
let result = code + 5;

Analiza el siguiente código:

¿Cuál es el valor de result?
¿Por qué no es una suma matemática?
¿Qué tipo de dato es code?
¿Qué tipo de dato es result?
¿Cómo harías para que el resultado fuera realmente 128?

Obtener múltiples caracteres de una cadena

también llamada subcadena o slice

let phrase = "Aprendiendo JavaScript";
phrase.slice(0, 11);
'Aprendiendo'

El índice inicial es 0 (incluido).
El índice final es 11 (no incluido).
JavaScript devuelve los caracteres desde el índice 0 hasta el 10.

Un método es un tipo especial de función que está asociado a un valor o tipo de dato específico.

Eliminar espacios en blanco con `trim`

El término whitespace (espacio en blanco) se refiere a caracteres que no imprimen tinta visible, como espacios o tabulaciones.

let userInput = "   Hola mundo   ";
userInput.trim();
'Hola mundo'

⚠ Importante:

Solo elimina espacios al principio y al final
No modifica la cadena
devuelve una nueva cadena

Otros métodos útiles

para cadenas

"HELLO".toLowerCase();
'hello'


"JavaScript".includes("Script");
true

"7".padStart(3, "0");
'007'

"Ja".repeat(3);
'JaJaJa'

Repite la cadena la cantidad de veces indicada.

Devuelve true si la cadena contiene la subcadena indicada.

Asegura que la cadena tenga al menos cierta longitud.
Si no la tiene, agrega el carácter indicado al inicio.

Convierte todas las letras a minúsculas.

Repite la cadena la cantidad de veces indicada.

ejercicios

1️⃣Extrae una subcadena

let framework = "Vue.js";

Dada la cadena:

obtén la subcadena: js

ejercicios

2️⃣Corrige el error

let word = "Programacion";
word.slice(3, 3);

El siguiente código no devuelve lo esperado:

Qué devuelve?
¿Por qué?
Corrígelo para que devuelva "gram".

ejercicios

3️⃣Limpieza de entrada

let email = "   usuario@email.com   ";

Un usuario escribió:

Elimina los espacios innecesarios.
Guarda el resultado en una nueva variable.
Verifica que la variable original no haya cambiado.

ejercicios

4️⃣Prueba con casos extremo

"Hola".repeat(0);
"Hola".repeat(-1);
"Hola".padStart(2, "*");

¿Qué ocurre en cada caso?

Explica cada resultado.

ejercicios

5️⃣Construcción controlada

Escribe un código que:

Declare una variable code con valor "5".
Use padStart para convertirlo en "005".
Luego repita ese resultado 2 veces.

Resultado esperado:

Secuencias de Escape (scape secuences)

Para incluir caracteres especiales dentro de tus strings, como saltos de línea o tabulaciones. Js permite hacerlo mediante secuencias de escape.

// Salto de línea:
console.log("Hola\nMundo");

Una secuencia de escape es una combinación de caracteres que comienza con una barra invertida (\) y que representa otro carácter especial.

Secuencia	Resultado
\'	Comilla simple
\"	Comilla doble
\\	Barra invertida
\n	Salto de línea
\t	Tabulación

Template Literals

es un tipo especial de string que puede evaluar expresiones dentro de ella.

// Se escribe usando backticks (`)
`Hola ${expresion}`

`El resultado es ${5 * 5}`;
'El resultado es 25'

let user = "Carlos";

`Hola, ${user}!`;
'Hola, Carlos'

Es una forma más clara, legible y moderna que la concatenación

`undefined` y `null`

Estos valores representan: la ausencia de valor.

Cuando JS no tiene un valor para algo, devuelve undefined por defecto.

let emptyValue;
emptyValue;
undefined

console.log("Algo");
undefined

null sirve para indicar de manera intencional que algo está vacío.

let phoneNumber = null;
phoneNumber;
null

Booleanos (Booleans)

Boolean es un tipo de dato primitivo.
Representa valores de verdadero o falso.

Solo existen dos literales booleanos

true
false

let isLoggedIn = true;
isLoggedIn;
true

¿Por qué son importantes los Booleanos?

permiten trabajar con lógica.

Si quieres que tu programa se comporte de manera diferente según una condición, necesitas poder expresar si esa condición es verdadera o falsa.

Operadores relacionados con Booleanos

Existen dos tipos principales de operadores que producen valores Booleanos:

1️⃣Operadores lógicos

Toman valores Booleanos y devuelven Booleanos

2️⃣Operadores de comparación

Comparan números, cadenas u otros valores y devuelven un Booleano.

Operadores lógicos

Existen tres operadores lógicos Booleanos en JavaScript: and, or y not.

Operador AND (`&&`)

toma dos valores (llamados operandos) y devuelve true únicamente si ambos operandos son true.

Operador OR (`||`)

devuelve true si al menos uno de los operandos es true.

let isLogged = true;
let hasPermition = true;

hasBadge && passActive;
true

let isAdmin = false;
let isEditor = true;

isAdmin || isEditor;
true

Operadores lógicos

Existen tres operadores lógicos Booleanos en JavaScript: and, or y not.

Operador NOT (!)

toma un solo valor y devuelve su opuesto.

!true;   // false
!false;  // true

let accountActive = false;
!accountActive;
true
// la cuenta no está activa

Combinando operadores

pueden combinarse para formar expresiones más complejas.

let maintenanceMode = true;
let blocked = false;

!maintenanceMode && !blocked;
false

Supongamos que puedes enviar un formulario solo si:

```
No estás en modo mantenimiento
```
```
Y no estás bloqueado
```

Ley de Morgan

Una expresión como:

!a && !b

Puede reescribirse como:

!(a || b)

!a || !b

!(a && b)

Puede reescribirse como:

Operadores de Comparación

Los operadores de comparación comparan valores y devuelven un Booleano.

Igualdad estricta (===)

verifica si dos valores son exactamente iguales.

10 === 10;      // true
4 === 9;        // false
3 * 3 === 9;    // true
"hola" === "hola"; // true
"hola" === "Hola"; // false
true === true;  // true

Igualdad estricta (===)

El operador !== verifica si dos valores no son iguales.

7 !== 7;            // false
"perro" !== "gato"; // true

// Equivale a: !(7 === 7);

Mayor y menor que

Operadores matemáticos:

> mayor que
< menor que
>= mayor o igual
<= menor o igual

3 > 1;      // true
8 > 8;      // false
8 >= 8;     // true
-2 < 0;     // true
5 <= 5;     // true

Comparación con Strings

Se comparan carácter por carácter, como un diccionario

"apple" < "banana";  // true
"zebra" > "yak";     // true

🧠 EJERCICIOS

(Operadores Lógicos y de Comparación)

1️⃣ Evaluación lógica

Dado:

let hasAccess = true;
let isVerified = false;

¿Qué devuelve?

hasAccess && isVerified
hasAccess || isVerified
!isVerified

Explica el resultado

2️⃣ Detecta el error lógico

El siguiente código pretende verificar si un usuario puede comprar alcohol (mayor de 18 y no bloqueado):

let age = 20;
let blocked = false;

age > 18 || !blocked;

¿Es correcta la lógica?
Corrígela

3️⃣ Comparación de strings

¿Qué devuelve cada expresión?

"Java" === "JavaScript"
"abc" < "abd"
"100" > "20"

Explica por qué.

4️⃣ Ley de Morgan

Reescribe la siguiente expresión usando la Ley de De Morgan:

!isStudent && !hasDiscount

5️⃣ Construye la condición correcta

Crea una expresión que sea true únicamente cuando:

La temperatura sea mayor a 20
Y menor o igual a 30

Usa una variable llamada temperature.

Estructuras de Control

Condicionales

Bucles

Añaden lógica y estructura a los programas al permitir que el código tome decisiones basadas en condiciones específicas. Juntos, los condicionales y los bucles se conocen como estructuras de control porque permiten controlar cuándo y con qué frecuencia se deben ejecutar partes del código.

Condicionales

Permiten ejecutar un fragmento de código solo si se cumple una condición.

Sentencia `If`

Ejecuta código si una condición es verdadera o lo omite si es falsa.

<html>
  <body>
  <script>
  	let lifePoints = 10;
	console.log(`Puntos de vida ${lifePoints} xp.`);

	if (lifePoints > 0) {
  		console.log("Sigue jugando.");
	}
  </script>
  </body>
</html>

Sentencia `If...else`

Permite ejecutar un fragmento de código cuando una condición sea verdadera, u otro cuando sea falsa.

<html>
  <body>
  <script>
  	let lifePoints = 10;
	console.log(`Puntos de vida ${lifePoints} xp.`);

	if (lifePoints > 0) {
  		console.log("Sigue jugando.");
	} else {
      console.log("Moriste 💀");
    }
  </script>
  </body>
</html>

Condiciones más complejas

Es posible usar expresiones booleanas más complejas como condiciones incorporando operadores lógicos:

<html>
  <body>
  <script>
  	let lifePoints = 10;
	console.log(`Puntos de vida ${lifePoints} xp.`);

	if (lifePoints > 0 && lifePoints <= 20) {
  		console.log("Cuida tus puntos de vida");
	}
    else if (lifePoints > 20 && lifePoints <= 50) {
      console.log("Puntos de vida en buen estado");
    }
    else {
      console.log("Moriste 💀");
    }
  </script>
  </body>
</html>

🧠 1️⃣ Evaluación paso a paso

let temperature = 18;

if (temperature > 25) {
  console.log("Hace calor");
} else if (temperature > 15) {
  console.log("Clima templado");
} else {
  console.log("Hace frío");
}

Dado el siguiente código:

Preguntas:

¿Qué se imprime?
¿Qué pasaría si temperature fuera 26?
¿Qué pasaría si fuera 15 exactamente?
Explica por qué el orden de las condiciones importa.

🛠 2️⃣ Encuentra el error lógico

let score = 85;

if (score >= 60) {
  console.log("Aprobado");
} else if (score >= 80) {
  console.log("Excelente");
} else {
  console.log("Reprobado");
}

El siguiente código intenta clasificar una nota:

¿Cuál es el problema?
¿Qué mensaje se imprime realmente?
Corrige la lógica para que:
- 80 o más → "Excelente"
- 60–79 → "Aprobado"
- Menor a 60 → "Reprobado"

✍️ 3️⃣ Escribe el código

Escribe un programa que:

Declare una variable age
Si es menor a 13 → imprima "Niño"
Si es entre 13 y 17 → imprima "Adolescente"
Si es 18 o más → imprima "Adulto"

Después:

Modifica tu código para que también valide que la edad no sea negativa.

🔎 4️⃣ Refactoriza mejor

El siguiente código funciona, pero no está bien estructurado:

let loggedIn = true;

if (loggedIn === true) {
  console.log("Bienvenido");
} else if (loggedIn === false) {
  console.log("Por favor inicia sesión");
}

¿Cómo lo simplificarías?
¿Qué pasa si loggedIn fuera false?

🚀 5️⃣ Lógica combinada

Tienes estas variables:

let hasTicket = true;
let isVIP = false;
let age = 20;

1. Reglas:

Puede entrar si:
- Tiene boleto Y es mayor o igual a 18
- O es VIP (aunque sea menor)

Escribe la condición correcta usando if.

2. Luego responde:

¿Con los valores actuales puede entrar?
¿Qué combinación haría que NO pueda entrar?
¿Puedes reescribir la condición usando paréntesis para que sea completamente clara?

🚀 6 Acceso a Plataforma Online

Tienes estas variables:

let hasSubscription = true;
let hasTrial = false;
let accountSuspended = false;

📋 Reglas:

Un usuario puede acceder a la plataforma si:

Tiene suscripción activa O
Tiene período de prueba activo

Pero en ningún caso puede acceder si su cuenta está suspendida.

🧠 Tareas:

Escribe la condición correcta usando if.

Debe respetar exactamente las reglas anteriores.

Reescribe la condición usando paréntesis para que quede completamente explícita y fácil de leer.

¿Cómo escribirías la condición inversa?
Es decir, la condición que determine cuándo NO puede acceder.

Repetir código en bucle

Bucle `while`

El bucle while depende de una prueba condicional. Omite la ejecución de su código si la condición es falsa inicialmente y lo ejecuta mientras sea verdadera

<script>
let temperature = 32;

while (temperature > 26) {
  console.log(`La temperatura actual es ${temperature}°C.`);
  temperature--;
}

console.log(`Ahora la temperatura es ${temperature}°C.`);
</script>

los bucles permiten ejecutar un fragmento de código repetidamente mientras la condición se cumpla.

⚠️ ¡Cuidado con los bucles infinitos!

Un bucle infinito, donde la condición del bucle siempre se mantiene en true

<script>
let temperature = 32;

while (temperature > 26) {
  console.log(`La temperatura actual es ${temperature}°C.`);
  // temperature--;
}

console.log(`Ahora la temperatura es ${temperature}°C.`);
</script>

Bucle for

Al igual que un while, un for repite su ejecución mientras una condición sea verdadera. La diferencia es que, en un for, la lógica que controla la repetición aparece concentrada al inicio del bucle, separada del cuerpo

<script>

  for (let attempts = 5; attempts > 0; attempts--) {
    console.log(`Te quedan ${attempts} intentos.`);
  }
  
</script>

Inicialización

Condición

Actualización

Convertir bucle for a bucle while

Convierte el siguiente bucle for a su equivalente en bucle while

<script>

  for (let attempts = 5; attempts > 0; attempts--) {
    console.log(`Te quedan ${attempts} intentos.`);
  }
  
</script>

Scope

Todos los enlaces (variables y constantes) en JS tienen scope (alcance), que es el área del código donde pueden utilizarse.

<script>

  for (let attempts = 5; attempts > 0; attempts--) {
    console.log(`Te quedan ${attempts} intentos.`);
  }

  console.log(attempts); // Error
  
</script>

<script>
  let attempts = 5;
  while ( attempts > 0) {
    console.log(`Te quedan ${attempts} intentos.`);
     attempts--;
  }
  
  console.log(attempts); // Funciona!

</script>

Tipos de datos compuestos

en JS los tipos de datos primitivos representan un solo dato, como un número o una cadena

Los tipos de datos compuestos combinan múltiples datos en una sola estructura

Arrays

Los elementos de un array pueden ser de cualquier tipo de dato
Agrupan valores relacionados en un solo lugar.
Pueden crecer o reducirse dinámicamente.
Mantienen el orden de los elementos.
Permiten recorrer todos sus elementos fácilmente con bucles.

Un array en JavaScript es un tipo de dato compuesto que contiene una lista ordenada de valores.

let temperatures = [18, 21, 19, 23, 25, 20];

Índices

Cada elemento de un array tiene un número de índice asociado.

temperature[0]; // 1er elemento

Cantidad de elementos

Sabe cuántos elementos tiene el array

temperatures.length; // 6

Último elemento

Como los índices comienzan en 0, el último índice siempre es:

length - 1;

temperatures[temperatures.length - 1];

Reemplazar

Puedes modificar un elemento usando su índice

temperatures[2] = 30;
temperatures;

Array de Arrays (Multidimensionales)

Un array puede contener otros arrays.
A este tipo de estructura se le llama array multidimensional.

Son muy útiles para representar:

Tablas
Grillas bidimensionales
Tableros
Matrices
Coordenadas

let board = [
  ["", "", ""],
  ["", "", ""],
  ["", "", ""]
];

Acceder a elementos en arrays anidados

Para acceder a un elemento específico:

1️⃣ Primero seleccionas el índice del array externo.
2️⃣ Luego seleccionas el índice dentro del array interno.

arrayExterno[indiceFila][indiceColumna];

🧩 Ejemplo práctico

Colocar una "X" en la esquina superior derecha de el array multidimensional: board

let board = [
  ["", "", ""],
  ["", "", ""],
  ["", "", ""]
];

🧩Visualización Mental

Si lo piensas como una tabla:

[ [0,0] [0,1] [0,2] ]
[ [1,0] [1,1] [1,2] ]
[ [2,0] [2,1] [2,2] ]

Bucles y Arrays

Los bucles y los arrays sun un equipo ideal.

Un bucle recorre los elementos de un arreglo y realiza una acción sobre cada elemento del bucle si así se desea.

Bucles `for…of`

Un bucle for…of recorre los elementos de un arreglo.
Mientras que un while o un for tradicional repiten mientras una condición sea verdadera.

<script>
let animals = ["Dog", "Cat", "Rabbit"];

for (let animal of animals) {
  console.log(`${animal} is an animal.`);
}
</script>

Usando un `for` tradicional

Un bucle for…of recorre los elementos de un arreglo.
Mientras que un while o un for tradicional repiten mientras una condición sea verdadera.

<script>
let animals = ["Dog", "Cat", "Rabbit"];

for (let i = 0; i < animals.length; i++) {
  console.log(`${animals[i]} is an animal.`);
}
</script>

Acceder a índices con `entries()`

Una ventaja del for tradicional es que tienes acceso directo al índice, pero también puedes usar for..of junto con el método entries()

<script>
let animals = ["Dog", "Cat", "Rabbit"];

for (let [index, value] of animals.entries()) {
  console.log(`${index}: ${value} is an animal.`);
}
</script>

🧠 EJERCICIOS — Arrays + Bucles

1️⃣ Recorre e imprime

Dado: let numbers = [5, 10, 15, 20];

Usa un for…of para imprimir cada número multiplicado por 2.

2️⃣ Usa un for tradicional

Dado: let names = ["Ana", "Luis", "Marta"];

Usa un for clásico para imprimir:

0: Ana 1: Luis 2: Marta

🧠 EJERCICIOS — Arrays + Bucles

3️⃣ Suma todos los elementos

Dado: let values = [3, 7, 2, 9];

Usa un bucle para calcular la suma total y guardarla en una variable total.

4️⃣ Índices pares

Dado: let letters = ["a", "b", "c", "d", "e"];

Imprime únicamente los elementos que estén en índices pares.

🧠 EJERCICIOS — Arrays + Bucles

5️⃣ Modifica elementos

Dado: let prices = [100, 200, 300];

Usa un bucle para aumentar cada precio en un 10%.
Modifica el arreglo original.

Básicos de Javascript

By Carlos Hernández

Básicos de Javascript

Carlos Hernández

Me gusta la programación: comparto en mi canal de Youtube llamado YouDevs lo poco que sé sobre el tema.

Básicos de

Expresiones y Sentencias

Sentencias (declaraciones)

Números y Operadores

Orden de las Operaciones

Punto Flotante

Enlaces (Bindings)

Variables

Constantes

Variables

Constantes

Constantes

Constantes

Convenciones de Nombres

ejercicios

🧠 Ejercicio 1 — Orden de operaciones

ejercicios

🛠 Ejercicio 2 — Encuentra y corrige el error

ejercicios

📐 Ejercicio 3 — Fórmula matemática con variables

ejercicios

🏷 Ejercicio 4 — Nombres bien y mal definidos

ejercicios

🚀 Bonus (si quieres subir nivel)

Comentarios

Sumar y Restar

Operador de

incremento y decremento

Operador de

asignación con signo

Multiplicar y Dividir

Operador de

incremento y decremento

Pruébalo

Usa el operador *= para observar el efecto del interés compuesto.

ejercicio

🛠 Ejercicio 1 — Encuentra y corrige el error

Cadenas de caracteres (Strings)

String literal

Unir cadenas

Obtener la longitud

Obtener un carácter específico

ejercicios

🧠 Ejercicio 1 — Indexación y concatenación

ejercicios

🛠 Ejercicio 2 — Refactoriza el código

ejercicios

🛠 Ejercicio 2 — Detecta el bug conceptual

Obtener múltiples caracteres de una cadena

Eliminar espacios en blanco con trim

Otros métodos útiles

para cadenas

ejercicios

1️⃣Extrae una subcadena

ejercicios

2️⃣Corrige el error

ejercicios

3️⃣Limpieza de entrada

ejercicios

4️⃣Prueba con casos extremo

ejercicios

5️⃣Construcción controlada

Secuencias de Escape (scape secuences)

Template Literals

undefined y null

Booleanos (Booleans)

Operadores relacionados con Booleanos

1️⃣Operadores lógicos

2️⃣Operadores de comparación

Operadores lógicos

Operador AND (&&)

Operador OR (||)

Operadores lógicos

Operador NOT (!)

Combinando operadores

Ley de Morgan

Operadores de Comparación

🧠 EJERCICIOS

(Operadores Lógicos y de Comparación)

Estructuras de Control

Usa el operador `*=` para observar el efecto del interés compuesto.

Eliminar espacios en blanco con `trim`

`undefined` y `null`

Operador AND (`&&`)

Operador OR (`||`)

Sentencia `If`

Sentencia `If...else`

Bucle `while`

Bucles `for…of`

Usando un `for` tradicional

Acceder a índices con `entries()`