En JavaScript no todas las variables son iguales y es importante entender cómo funciona el alcance de las variables.
En este lenguaje existen dos tipos de scope (alcance) de variables: global y local.
Las variables declaradas fuera de cualquier función tienen alcance global, lo que significa que pueden ser accedidas y modificadas desde cualquier parte del código. Por otro lado, las variables declaradas dentro de una función tienen alcance local, lo que significa que solo pueden ser accedidas y modificadas dentro de esa función.
Es importante tener en cuenta que cuando se declara una variable con var dentro de una función, esta variable tendrá alcance global, aunque esté dentro de una función. Sin embargo, si se declara con let o const, la variable tendrá alcance local.
Otro concepto importante a entender es el de hoisting, que se refiere al comportamiento de javascript de mover las declaraciones de variables al inicio del ámbito en el que están declaradas. Esto significa que si se declara una variable dentro de una función, javascript la moverá al inicio de la función, incluso antes de que se ejecute cualquier línea de código dentro de la función.
Por ejemplo, si tenemos el siguiente código:
functionmiFuncion(){console.log(x);var x =10;}miFuncion();
Javascript movería la declaración de x al inicio de miFuncion, lo que significa que la línea console.log(x) daría como resultado "undefined", ya que x aún no ha sido inicializada en ese momento.
Scope se refiere a las reglas que definen la visibilidad y accesibilidad de las variables en el código. En JavaScript, existen dos tipos de scope: global y local. Las variables declaradas fuera de una función tienen un scope global, mientras que las variables declaradas dentro de una función tienen un scope local. Por ejemplo:
let nombre = 'Juan'; // scope global
function saludar() {
let nombre = 'María'; // scope local
console.log(`Hola ${nombre}!`);
}
saludar(); // output: Hola María!
console.log(`El nombre es ${nombre}`); // output: El nombre es Juan
Hoisting es la capacidad de JavaScript de "elevar" las declaraciones de variables y funciones al comienzo del ámbito actual. Por ejemplo:
console.log(mensaje); // output: undefined
var mensaje = 'Hola';
saludar(); // output: Hola
function saludar() {
console.log('Hola');
}
Aunque la variable mensaje se declara después de la llamada a console.log(), JavaScript "eleva" la declaración al comienzo del ámbito actual. De esta forma, cuando se ejecuta console.log(), la variable mensaje ya existe, aunque su valor sea undefined.
Hola, hola! no me gusta discernir cuando estoy aprendiendo, pero según tengo entendido existen 3 scope:
Global scope
Function scope
Bloque Scope
Si se declara "VAR" dentro de una función, el alcance de esa variable es es misma función, a diferencia si se declara en un bloque scope como condicionales, ciclos, etc... pruébrenlo ustedes mismo copiando y pegando este código:
function alcance(){
var scope;
console.log(scope);
}
scope= 5;
alcance();
Ojo! lo aprendí en la clase de Scope y Closure por Oscar Barajas, aquí les dejo el enlace... :)
Que javascript mueva la declaración al inicio no quiere decir que también mueva el valor que contiene. Es por eso que el resultado que arroja es undefined.
En lenguajes de más bajo nivel como es C, en este mismo ejemplo, al encontrarse una variable que no ha sido previamente declarada, daría error.
Javascript evita ese problema moviendo la declaración de la variable al inicio.
Tiene sus partes buenas y sus partes malas creo yo… ¿Qué opináis?
Las variables declaradas fuera de cualquier función tienen un ámbito global, lo que signiffica que pueden ser accedidas desde cualquier parte del código. Las variables declaradas dentro de una función tienen un alcance local, lo que significa que solo se pueden acceder y modificar dentro de esa función.
El uso de var para declarar variables dentro de una función crea una variable loca, mientras que el uso de let y const crea una variable local.
El hoisting es el comportamiento de JavaScript de mover las declaraciones de variables al incio del ámbito en el que se declaran
Variable global
var nombre ="Juan";functionimprimirNombre(){console.log(nombre);}imprimirNombre();// salida: "Juan"
Variable local
functionimprimirNumero(){let numero =10;console.log(numero);}imprimirNumero();// salida: 10console.log(numero);// error: "numero" is not defined
Hoisting
functionmiFuncion(){console.log(x);var x =10;}miFuncion();// salida: undefined
Hola. Agrego que se considera buena práctica solo usar 'let' y 'const' para declarar variables porque conllevan a tener un código más fácil de entender y trabajar en equipo (además de algunas optimizaciones en memoria). Al usar 'var' como declarador nos sentimos con confianza de generar variables super globales que nos inducen a colisiones de definición o a crear scripts gigantes. Los expertos dicen no usar nada de var; JS lo mantiene solo por la retrocompatibilidad.
.
Algunos argumentos técnicos al respecto en este link
lock
lock
