Scope
¿Qué es el Scope?
El scope (o ámbito) es el contexto en el que una variable existe y puede ser accedida. Determina qué partes del código “ven” esa variable y cuáles no. En JavaScript existen tres tipos principales: global, de función y de bloque.
¿Para qué se utiliza?
Entender el scope sirve para:
- Evitar conflictos entre variables con el mismo nombre en distintas partes del código.
- Controlar la visibilidad y el ciclo de vida de las variables.
- Prevenir bugs causados por variables globales que se modifican accidentalmente.
- Entender cómo funcionan los closures y el hoisting.
- Escribir código más predecible y fácil de depurar.
¿Cómo funciona?
Imagina el scope como puertas de una casa. Las variables globales son muebles en el salón — todos los acceden. Las variables de función son objetos dentro de un armario — solo quien está dentro del armario los ve. Las de bloque son cajones dentro de ese armario — más limitados todavía. Desde dentro siempre puedes ver hacia afuera, pero no al revés.
Ejemplo: Los tres tipos de scope
// 1. SCOPE GLOBAL — accesible desde cualquier sitio
const appNombre = 'MiApp';
function saludar() {
console.log(appNombre); // ✅ Accede al scope global
}
// 2. SCOPE DE FUNCIÓN — solo dentro de la función
function calcular() {
const resultado = 42; // Solo existe dentro de calcular()
console.log(resultado); // ✅ Accesible
}
console.log(resultado); // ❌ ReferenceError: resultado is not defined
// 3. SCOPE DE BLOQUE — solo dentro de {} con let/const
if (true) {
let mensajeBloque = 'Hola desde el bloque';
const pi = 3.14;
var antiguoVar = 'yo me escapo'; // var ignora los bloques
console.log(mensajeBloque); // ✅ Accesible
}
console.log(mensajeBloque); // ❌ ReferenceError
console.log(pi); // ❌ ReferenceError
console.log(antiguoVar); // ✅ Accesible — var no tiene scope de bloque
Ejemplo: Scope y var vs let
// var: scope de función, se "escapa" de los bloques
for (var i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 100);
}
// Imprime: 3, 3, 3 — todas las callbacks ven la misma 'i'
// let: scope de bloque, cada iteración tiene su propia 'i'
for (let j = 0; j < 3; j++) {
setTimeout(() => console.log(j), 100);
}
// Imprime: 0, 1, 2 — cada callback captura su propia 'j'
El scope es la base para entender algunos de los bugs más comunes en JavaScript. Preferir let y const sobre var es una de las prácticas más sencillas para evitar comportamientos inesperados.