JavaScript
Explica cómo JavaScript resuelve nombres mediante scope léxico, busca bindings hacia fuera y conserva entornos en funciones, callbacks y módulos.
JavaScript utiliza scope léxico: una función puede acceder a los nombres disponibles en el lugar donde fue escrita, no en el lugar desde donde se llama.
const language = "JavaScript";
function showLanguage() {
console.log(language);
}La estructura de scopes puede determinarse observando dónde están escritas las declaraciones.
const application = "DomiSys";
function createReport() {
const section = "Inventory";
function printTitle() {
console.log(application, section);
}
printTitle();
}printTitle está escrita dentro de createReport, que a su vez está dentro del scope superior.
Su cadena de búsqueda es:
printTitle
↓
createReport
↓
scope superior del módulo o scriptPor eso encuentra tanto section como application.
Cuando JavaScript encuentra un nombre como section, sigue este proceso conceptual:
ReferenceError.const first = "A";
function outer() {
const second = "B";
function inner() {
const third = "C";
console.log(first, second, third);
}
inner();
}Desde inner:
third se encuentra localmente.second se encuentra en outer.first se encuentra en el scope superior.Un scope exterior no puede entrar en un scope interior.
function outer() {
function inner() {
const secret = "local";
}
console.log(secret); // ReferenceError
}Tampoco una función hermana puede acceder directamente a los locales de otra.
function parent() {
function firstChild() {
const value = 10;
}
function secondChild() {
console.log(value); // ReferenceError
}
}const value = "global";
function printValue() {
console.log(value);
}
function run() {
const value = "local";
printValue();
}
run(); // "global"Aunque printValue se llama dentro de run, no utiliza el value local de run. Fue escrita en el scope superior, así que su referencia exterior apunta a ese entorno.
JavaScript no usa scope dinámico para resolver estas variables.
const taxRate = 0.19;
function calculateTotal(subtotal) {
const tax = subtotal * taxRate;
return subtotal + tax;
}Dentro de calculateTotal:
subtotal se encuentra como parámetro local.tax se encuentra localmente.taxRate se encuentra en el scope exterior.function createGreeting(prefix) {
return function greet(name) {
return `${prefix}, ${name}`;
};
}
const sayHello = createGreeting("Hello");
sayHello("Nicolás"); // "Hello, Nicolás"greet continúa accediendo a prefix incluso después de que createGreeting terminó. Ese comportamiento recibe el nombre de closure y se estudiará en una nota específica.
function createLogger(label) {
return function log(message) {
console.log(`[${label}] ${message}`);
};
}
const inventoryLogger = createLogger("Inventory");
const ordersLogger = createLogger("Orders");
inventoryLogger("Low stock");
ordersLogger("New order");Aunque ambas funciones se crean a partir del mismo código, cada llamada a createLogger produce un entorno diferente con su propio label.
La cadena de scopes resuelve identificadores:
console.log(user);Después de encontrar user, el acceso .profile.name utiliza las reglas de objetos y prototipos:
console.log(user.profile.name);Son dos búsquedas diferentes:
user mediante la cadena de scopes.No conviene confundir la scope chain con la prototype chain.
function processOrder(order) {
const orderId = order.id;
setTimeout(function notify() {
console.log(`Order ${orderId} processed`);
}, 1000);
}notify puede leer orderId porque fue creada dentro de processOrder.
El temporizador decide cuándo se llamará la función, pero no cambia qué scope exterior conserva.
// counter.js
let count = 0;
export function increment() {
count++;
return count;
}increment puede acceder al binding privado count del módulo. Otros módulos no pueden modificarlo directamente si no se exporta.
this.¿Qué imprime este código?
const name = "Global";
function printName() {
console.log(name);
}
function execute() {
const name = "Local";
printName();
}
execute();GlobalprintName fue declarada en el scope superior. El name local de execute no forma parte de su cadena léxica.
Shadowing explica qué ocurre cuando un scope interior declara un binding con el mismo nombre que uno exterior.