03. Variables y Scopes - cejaramillof/javaScript GitHub Wiki

Variables

Las variables son contenedores en los que puedes almacenar valores. Javascript:

• Es case sensitivity.
• Es débilmente tipado (weakly typed).

var nombreVariable;
let nombreVariableBloque;

// const crea una referencia inmutable (no reasingable), no variables inmutables
const NOMBRE_CONSTANTE_O_MAGIC_NUMBER;

// En javascript existe la doble asignación de variables:
var localVar = globalVar = 'Im Global'; // ambas tendrán el mismo string

Hoisting

Básicamente es usar una variable, antes de declararla. Hoisting es el comportamiento por defecto de JavaScript de mover todas las declaraciones a la parte superior del ámbito actual (en la parte superior de la secuencia de comandos actual o la función actual) y posteriormente hace la asignación.

Todas las declaraciones (var, let, const, function, function*, class) son "hoisted"

Diferencias: es la inicialización. Las segundas, solo se evalúan cuando son evaluadas, mientras están en una temporal dead zone

• var / function / function* ( undefined, execute fuction, o generator )

• let / const / class ( temporal dead zone, cannot access before initialization )

Alcance de una variable (Scope)

A qué bloques de código accederá una variable El Scope o ámbito es lo que define el tiempo de vida de una variable, en que partes de nuestro código pueden ser usadas. Las variables se envían por referencia a scopes descendientes predeterminadamente.

Lexical Scope / Ámbito Léxico

El intérprete de JavaScript funciona desde el ámbito de ejecución actual y funciona hasta encontrar la variable en cuestión. Si la variable no se encuentra en ningún ámbito, se genera una excepción.

Este tipo de búsqueda se llama ámbito léxico. El alcance de una variable se define por su ubicación dentro del código fuente, y las funciones anidadas tienen acceso a las variables declaradas en su alcance externo. No importa de dónde se llame una función, o incluso cómo se llama, su alcance léxico depende solo de dónde se declaró la función.

var global = 'I am global'
const helloWorld = () => {
  var global = 'I am local' // local var
  const func = () => {
    returnglobal
  }
  console.log(func()) // (local var) i am local
}
helloWorld(); 
console.log(global); // (global var) i am global

Global Scope

Variables disponibles de forma global se usa la palabra var, son accesibles por todos los scripts que se cargan en la página. Estando fuera de una función/clase (var o let). Las variables declaradas con Var pueden ser re-inicializadas.

var test = 'test';
var test = 't3st'; // no mostrará error porque es var

a = 'xd'; // Global Scope (Default Scope)

var b; // Global Scope
b = 'xd'; 

var c = 'xd'; // Global Scope - Permite Hoisting 
let c = 'xd'; // Global Scope - No permite Hoisting

Function Scope - Local Scope

Variables declaradas dentro de una función sólo visibles dentro de ella misma (incluyendo los argumentos que se pasan a la función). Estando dentro de una función/clase (var o let)

function foo() {
    var d = 'lol'; // Local Scope
    var e = 'lol'; // Local Scope
}

• Se puede tener una variable global y una local con el mismo nombre y diferente valor

Block Scope

Variables definidas dentro de un bloque, por ejemplo variables declaradas dentro un loop while o for. Se usa let y const para declarar este tipo de variables. Necesitan estar dentro de un bloque (if, while, for, loops, { }, etc) (let o const)

if (true) {
    let i = 1; // Block Scope
}
console.log(i); // ReferenceError: i is not defined

const f = 'constante'; // No permite hoisting

Module Scope

Cuando se denota un script de tipo module con el atributo type="module" las variables son limitadas al archivo en el que están declaradas.