Scopes en JavaScript

Los scopes (alcances) en JavaScript son un concepto fundamental para comprender cómo se gestiona la visibilidad y accesibilidad de las variables dentro de tu código.

Tipos de scopes: Link to heading

Global scope: Link to heading

• Es el alcance más amplio.
• Las variables declaradas con var (no recomendado en la actualidad), let o const dentro del código principal tienen alcance global.

Ejemplo: Link to heading

var globalVar = "I am global";

function greet() {
    console.log(globalVar); // Can access the global variable
}

greet();
console.log(globalVar); // Can be accessed from anywhere in the code

Function scope: Link to heading

• Las variables declaradas con let o const dentro de una función tienen alcance local a dicha función.
• No son accesibles desde fuera de la función.

Ejemplo: Link to heading

function introduce() {
    let name = "John";
    const age = 30;
    console.log(name, age); // Can only be accessed inside the function
}

introduce();
// console.log(name); // Error: name is not defined
// console.log(age); // Error: age is not defined (out of scope)

Block scope: Link to heading

• Introducido con ES6 (ECMAScript 2015), let y const también crean alcance de bloque.
• Las variables declaradas dentro de bloques (con llaves {}) como if statements, for loops, etc. solo son accesibles dentro de ese bloque.

Ejemplo: Link to heading

if (true) {
  let message = "Hello";
}

console.log(message); // Error: message is not defined (outside of block)

Resumen Link to heading

• Se recomienda usar let y const para declarar variables en lugar de var.
• let y const crean alcance de bloque por defecto.
• Las variables globales deben evitarse en la medida de lo posible, ya que pueden causar conflictos de nombres y dificultar el mantenimiento del código.

¡Sigue aprendiendo sobre scopes para escribir código JavaScript más modular y organizado!