JavaScript Medio · Teoría
22 lecciones originales con ejemplos breves, puntos clave y referencias para profundizar.
Cada declaración pertenece a un entorno léxico. Las funciones crean alcance local y los bloques delimitan let y const.
const global = "curso";
function leer() { const local = global; return local; }Una función conserva acceso al entorno donde fue creada incluso después de terminar la llamada exterior.
function contador() {
let valor = 0;
return () => ++valor;
}
const siguiente = contador();Las declaraciones se procesan antes de ejecutar el cuerpo, pero no todas pueden usarse igual. let y const permanecen inaccesibles hasta su inicialización.
saludar();
function saludar() { console.log("hola"); }Una declaración introduce un nombre en su ámbito. Una expresión crea una función como valor y puede asignarse a una constante.
function sumar(a, b) { return a + b; }
const restar = function (a, b) { return a - b; };Las funciones flecha ofrecen sintaxis compacta y capturan this del entorno exterior. No reemplazan todos los usos de function.
const cuadrado = (n) => n * n;
console.log(cuadrado(5));Un callback es una función entregada para que otro código la invoque. Permite separar una operación de la acción aplicada.
function aplicar(valor, accion) { return accion(valor); }
console.log(aplicar(3, (n) => n + 1));Una función de orden superior recibe funciones, devuelve funciones o hace ambas cosas. Es la base de muchas transformaciones declarativas.
const multiplicarPor = (factor) => (n) => n * factor;
const triple = multiplicarPor(3);La desestructuración extrae posiciones de arrays o propiedades de objetos hacia nombres locales.
const perfil = { nombre: "Mara", rol: "editora" };
const { nombre, rol } = perfil;La sintaxis ... expande valores en un nuevo contexto o reúne argumentos restantes. El significado depende de la posición.
const base = [1, 2];
const copia = [...base, 3];
const sumar = (...nums) => nums.reduce((a, n) => a + n, 0);map construye un array nuevo aplicando un callback a cada elemento sin alterar por sí mismo el original.
const dobles = [2, 4, 6].map((n) => n * 2);filter crea un array con los elementos cuyo callback produce un valor verdadero.
const pares = [1, 2, 3, 4].filter((n) => n % 2 === 0);reduce combina una colección en un acumulador. Un valor inicial explícito vuelve más predecible el contrato.
const total = [3, 5, 7].reduce((suma, n) => suma + n, 0);find devuelve el primer elemento coincidente. some pregunta si alguno cumple y every si todos cumplen.
const datos = [3, 8, 12];
console.log(datos.find((n) => n > 5));
console.log(datos.every((n) => n > 0));Objetos y arrays se manipulan mediante referencias. Spread crea otro contenedor, pero sus valores anidados continúan compartidos.
const original = { config: { tema: "claro" } };
const copia = { ...original };?. detiene un acceso cuando encuentra null o undefined. ?? usa un reemplazo sólo para esos dos valores.
const usuario = {};
console.log(usuario.contacto?.email ?? "sin correo");try delimita operaciones que pueden fallar. catch recibe el error y finally se ejecuta al terminar cualquiera de los caminos.
try { JSON.parse("{"); } catch (error) { console.error(error.name); } finally { console.log("fin"); }throw interrumpe el flujo normal con un valor. Usar instancias de Error conserva mensaje y traza útiles.
function dividir(a, b) {
if (b === 0) throw new Error("Divisor inválido");
return a / b;
}JSON.stringify convierte datos compatibles en texto y JSON.parse reconstruye un valor a partir de texto JSON válido.
const texto = JSON.stringify({ tema: "js" });
const dato = JSON.parse(texto);Una Promise representa un resultado futuro que puede cumplirse o rechazarse. then y catch registran continuaciones.
Promise.resolve(4)
.then((n) => n * 2)
.then(console.log);Una función async siempre devuelve una Promise. await pausa esa función hasta que el valor se resuelve, sin bloquear todo el entorno.
async function obtener() {
const valor = await Promise.resolve(9);
return valor;
}
console.log(await obtener());El código síncrono termina antes de procesar continuaciones de Promises. Esas continuaciones usan la cola de microtareas.
console.log("A");
Promise.resolve().then(() => console.log("B"));
console.log("C");Los módulos permiten declarar dependencias explícitas entre archivos mediante export e import. El navegador resuelve módulos bajo reglas distintas de un script clásico.
// calculos.js
export const doble = (n) => n * 2;
// app.js
import { doble } from "./calculos.js";