Alcance de bloque: para comprender el sombreado en JavaScript, primero debemos ser claros con el alcance. En los lenguajes de programación de computadoras, Scope es una cierta sección/región del programa donde una variable definida puede tener su existencia y puede ser reconocida, más allá de que no se puede acceder a ella. En JavaScript, un bloque es una declaración compuesta que se define mediante llaves {} y se usa para combinar varias declaraciones en una declaración donde JavaScript espera solo una declaración. Y se dice que todas las variables y funciones a las que se puede acceder dentro de un bloque están dentro del alcance de ese bloque, por lo que se denominan alcance de bloque.
Por ejemplo, las variables let y const se almacenan en un espacio de memoria separado, por lo que se denomina ámbito de bloque, pero se puede acceder a las variables var fuera del bloque, ya que se almacenan en el espacio de memoria del objeto global, por lo que se denomina ámbito global.
Sombreado: ahora, cuando se declara una variable en un determinado ámbito que tiene el mismo nombre definido en su ámbito externo y cuando llamamos a la variable desde el ámbito interno, el valor asignado a la variable en el ámbito interno es el valor que se almacenará en la variable en el espacio de memoria. Esto se conoce como sombreado o sombreado variable . En JavaScript, la introducción de let y const en ECMAScript 6 junto con el alcance de bloque permite el sombreado variable.
Ejemplo:
Javascript
function func() {
let a = 'Geeks';
if (true) {
let a = 'GeeksforGeeks'; // New value assigned
console.log(a);
}
console.log(a);
func();
Producción:
GeeksforGeeks Geeks
Sombreado ilegal: ahora, mientras se sombrea una variable, no debe cruzar el límite del alcance, es decir, podemos sombrear la variable var por la variable let pero no podemos hacer lo contrario. Entonces, si intentamos sombrear la variable let por la variable var , se conoce como sombreado ilegal y dará el error como «la variable ya está definida».
Ejemplo:
Javascript
function func() {
var a = 'Geeks';
let b = 'Geeks;
if (true) {
let a = 'GeeksforGeeks'; // Legal Shadowing
var b = 'Geeks'; // Illegal Shadowing
console.log(a); // It will print 'GeeksforGeeks'
console.log(b); // It will print error
}
}
func();
Producción:
Identifier 'b' has already been declared
Nota: Las funciones de flecha también siguen el mismo alcance y la misma regla de sombreado de variables.