Introducción

En JavaScript, scope y closures son conceptos fundamentales que sustentan gran parte de la lógica de aplicaciones modernas. Dominar estos temas permite escribir código más limpio, seguro y reutilizable, y es clave para aprovechar al máximo patrones como module pattern, currying y asynchronous programming.

¿Qué es scope?

El scope (alcance) determina la accesibilidad de variables, funciones y objetos en diferentes partes del código. JavaScript utiliza un scope léxico (lexical scope), lo que significa que el alcance se define en tiempo de escritura, no en tiempo de ejecución.

Tipos de scope

// Ejemplo de scope global
var globalVar = 'Soy global';
function demo() {
  // Scope de función
  var funcVar = 'Solo dentro de demo';
  if (true) {
    // Scope de bloque
    let blockVar = 'Solo dentro del if';
    console.log(blockVar); // → Soy blockVar
  }
  console.log(funcVar); // → Soy funcVar
  // console.log(blockVar); // Uncaught ReferenceError
}
demo();
console.log(globalVar); // → Soy global

¿Qué son los closures?

Un closure es la combinación de una función y el entorno léxico en el que fue creada. En otras palabras, la función "cierra" (closes over) las variables que estaban en su scope al momento de su definición, manteniéndolas accesibles aunque el contexto externo haya finalizado.

Cómo funciona internamente

• JavaScript crea un environment record para cada contexto de ejecución.
• Cuando una función interna hace referencia a una variable del contexto externo, se crea una referencia al environment record del padre.
• Ese registro persiste mientras exista al menos una referencia al closure.

Ejemplo clásico de closure

function crearContador(inicial = 0) {
  let cuenta = inicial; // Variable del scope externo
  return function () {
    cuenta++; // Acceso al closure
    return cuenta;
  };
}
const contador = crearContador(5);
console.log(contador()); // → 6
console.log(contador()); // → 7
// La variable 'cuenta' sigue viva gracias al closure

Casos de uso reales de closures

const AuthModule = (function () {
  let token = null; // Privado
  return {
    login(user, pass) {
      // Simulación de autenticación
      token = btoa(`${user}:${pass}`);
      return token;
    },
    getToken() {
      return token;
    },
    logout() {
      token = null;
    }
  };
})();
AuthModule.login('admin','1234');
console.log(AuthModule.getToken()); // → token en base64

function multiplicar(a) {
  return function (b) {
    return a * b;
  };
}
const doble = multiplicar(2);
const triple = multiplicar(3);
console.log(doble(5)); // → 10
console.log(triple(5)); // → 15

function fetchConCache(url) {
  let cache = null;
  return async function () {
    if (cache) return cache; // Usa el closure
    const res = await fetch(url);
    cache = await res.json();
    return cache;
  };
}
const obtenerUsuarios = fetchConCache('/api/users');
obtenerUsuarios().then(console.log); // Primera llamada -> fetch
obtenerUsuarios().then(console.log); // Segunda llamada -> cache

Comparativa con otros lenguajes

Buenas prácticas y patrones recomendados

• Limita la profundidad de anidamiento. Demasiados closures encadenados pueden dificultar la depuración.
• Usa const siempre que sea posible. Evita mutaciones inesperadas del entorno del closure.
• Deshaz referencias innecesarias. Cuando un closure ya no es necesario, asigna null a sus variables externas para permitir la recolección de basura.
• Prefiere funciones flecha (=>) para closures simples. No crean su propio this, lo que evita sorpresas al trabajar con objetos.
• Documenta el alcance de variables críticas. Comentarios como // closure: mantiene token facilitan el mantenimiento.

Depuración y troubleshooting

Los closures pueden generar memory leaks si retienen referencias a objetos grandes (DOM, conexiones, etc.). Herramientas útiles:

• Chrome DevTools – Heap Snapshot: identifica objetos retenidos por closures.
• Node.js – --inspect y node --trace-gc: rastrea la recolección de basura.

Ejemplo de detección de fuga:

function crearFuga() {
  const grande = new Array(1e6).fill('x'); // ~8 MB
  return function () {
    console.log('Fuga activa'); // mantiene referencia a 'grande'
  };
}
let fuga = crearFuga();
// Si nunca llamamos a 'fuga' ni la anulamos, la memoria no se libera.
// Solución:
// fuga = null; // Permite al GC colectar 'grande'

Seguridad y rendimiento

Los closures no introducen vulnerabilidades por sí mismos, pero pueden exponer datos sensibles si se exportan sin control. Mantén siempre los datos críticos dentro de un closure y expón únicamente funciones que necesiten acceso.

En cuanto al rendimiento, los closures añaden una pequeña sobrecarga de creación de environment records. En la práctica, la diferencia es despreciable para la mayoría de aplicaciones, pero en bucles críticos (p.ej., renderizado de canvas a 60 fps) es recomendable evitar crear closures dentro del bucle.

Preguntas frecuentes (FAQ)

¿Un closure puede acceder a variables declaradas después de la función?

No. El scope se define en tiempo de compilación; la función solo ve variables que ya existen en su entorno léxico.

¿Los closures funcionan con async/await?

Sí. El closure conserva su entorno incluso cuando la ejecución se suspende y reanuda.

¿Cuál es la diferencia entre una IIFE y un closure?

Una IIFE (Immediately Invoked Function Expression) es una función que se ejecuta al instante; puede crear un closure, pero su propósito principal es crear un scope aislado.

Conclusión

Comprender scope y closures es esencial para escribir JavaScript robusto, modular y eficiente. Aprovecha los patrones presentados, sigue las buenas prácticas y mantente atento a posibles fugas de memoria. Con estos conocimientos, podrás diseñar APIs limpias, gestionar estado interno de forma segura y dominar la programación asíncrona sin sorpresas.