Mientras escribo un artículo sobre cierres y VIDA hace unos días. Estaba tratando de explicar el alcance léxico de una manera corta y sencilla. Noté que el artículo se estaba haciendo más y más grande, así que decidí escribir sobre el alcance léxico por separado.
En este artículo, intentaría explicar los conceptos básicos del alcance léxico, lo que significa y dar ejemplos para ayudarlo a comprender cómo funciona en JavaScript. Sin palabras de moda…Lo prometo.

En primer lugar, desglosemos la palabra «Ámbito Léxico».

alcance

Primero hablaremos de lo fácil: alcance.
En inglés simple, scope puede significar:

• Un límite
• Una región
• Un entorno

O cualquier otro sinónimo que se le ocurra.

¿Recuerda haber visto un tutorial en el que el instructor le dice que una determinada idea/tema está más allá del alcance del video?
O cuando un equipo de otro departamento está trabajando en un proyecto y le dices que agregue una característica que crees que es genial y te dicen:»Eso está más allá del alcance de este proyecto».Bueno, creo que entiendes lo esencial. El alcance es simplemente una región en la que se permite que algo opere en un período de tiempo determinado.

En Informática, esto podría significar una región donde existen algunos datos y se puede acceder a ellos. Estos datos podrían ser algo así como una variable.

En un lenguaje como JavaScript, podríamos definir un ámbito creando un bloque usando llaves: {...}. A esto lo llamamos Alcance de bloque. Esto significa que las variables declaradas dentro de este bloque solo se pueden acceder dentro de esta región. Esta región cubre todo lo que hay dentro de ella, incluidos otros bloques infantiles/interiores creados dentro de esa región.
En otras palabras, esta región es local y no se puede acceder directamente a sus variables desde el mundo exterior. Así que esto podría llamarse un alcance local. Las variables declaradas dentro de funciones están en el ámbito local de la función.

function doSomething() { let name = "john"; console.log(name)}doSomething(); // Prints 'john'// would produce a Reference error// because name is local to doSomething() function's scopeconsole.log(name); 

Ahora, es posible que haya oído hablar del Alcance global antes. Bueno, ese es un entorno que no está encerrado en un bloque. Cada código en su entorno Javascript tiene acceso a él. Este es el entorno JavaScript abierto. Así que el siguiente código debería funcionar.

let name = "john"; // In the global scopefunction doSomething() { name = "James" console.log(name); // The function can access the global scope variable 'name'}doSomething(); // Prints "James"console.log(name); // Can access 'name' too

Una cosa a tener en cuenta:

Un ámbito tiene acceso a su ámbito primario, pero el ámbito primario no tiene acceso directo a las variables declaradas en el interior del ámbito.

La función tiene acceso a name debido a que la función es declarada en el ámbito global y name existe en el ámbito global. Si el nombre fue declarado dentro de la función doSomething(), entonces el código en el ámbito global no puede cambiar el valor de name directamente porque name es local a la función.

Creo que tiene una buena comprensión de lo que significa Alcance. Simplemente significa una región o entorno donde existe una variable y se puede acceder a ella o modificarla.

Ahora, hablemos de»Léxico»

Léxico

Para entender léxico, veamos primero la palabra de la que se deriva: Léxico.El léxico se derivó de la palabra latina: «lexis «que significa»palabra»
En inglés sencillo:

Lexicon simplemente significa un diccionario. En palabras ordenadas, significa un vocabulario del idioma de una persona. Es como un libro donde se almacena el significado/definición de las palabras.

Siempre que desee encontrar el significado de una palabra, vaya al léxico.
No ves dónde se usa la palabra y adivinas lo que significa y su contenido o valor. Siempre vas al léxico, donde el propósito de la palabra se crea y se define claramente.

Ahora con esa explicación:

Léxica simplemente significa algo relacionado con el léxico. En otras palabras, significa algo relacionado con palabras o vocabulario del idioma de una persona. Algo relacionado con la creación o definición de palabras.

Hablemos del ámbito léxico.

Alcance léxico

Hemos visto el significado de las dos palabras en inglés sencillo.Con ese conocimiento, definamos el Alcance Léxico en inglés sencillo:

El ámbito léxico simplemente significa que la región en la que existe una palabra está determinada por el lugar donde se definió o creó.

Otras definiciones serían:

El alcance léxico significa que el significado / valor de una palabra solo puede determinarse por la región/entorno donde se creó.

El alcance léxico significa que no subcontratas directamente el significado de una palabra a personas de una región externa que usa la palabra. Esto se debe a que lexical pone énfasis en el origen en donde fue creado / definido.

Bien, daré un ejemplo.Usemos la palabra: «Danza».La palabra «danza» fue creada / definida en Gran Bretaña. El pueblo británico conoce su significado. Esta palabra existe en el ámbito en el que fue creada: «Gran Bretaña». Gales está en Gran Bretaña, por lo que Gales tiene acceso a esta palabra (recuerde que ya explicamos por qué más arriba). Para que el pueblo galés pueda actualizar el significado de esta palabra para adaptarla a su dialecto local. Esto se debe a que están dentro del alcance de Gran Bretaña.

Los alemanes no pueden venir directamente y cambiar el significado de esta palabra. Esto se debe a que la palabra no fue creada en Alemania. Por lo tanto, si los alemanes quisieran usar la palabra inglesa «dance» y esa palabra aún no ha sido creada por Gran Bretaña, esa palabra no estaría disponible por mucho que lo intenten. Esto haría que nadie supiera el significado real de esa palabra en Alemania porque la palabra no existe en el Léxico británico. (No se preocupe si esto parece un galimatías, lo explicaré con código más adelante)

Dado que somos estudiantes de Ciencias y no lingüistas, reemplacemos «palabra» por «variable».

Nuestra nueva definición sería:

El ámbito léxico simplemente significa que la región en la que existe una variable está determinada por el lugar donde se definió o creó.

Ámbito léxico significa que el significado / valor de una variable solo puede determinarse por la región / entorno donde se creó.

Ámbito léxico significa que no externaliza directamente el significado de una variable al código de una región externa (bloque) que usa la variable. Esto se debe a que lexical pone énfasis en el origen en el lugar donde se creó/definió la variable.

Así que lo que nos muestra el ámbito léxico es que una variable solo se puede usar en el ámbito en el que se creó y no donde se llamó.

Veamos cómo funciona esto en código:

function rideBritishBoat() { let boatName = "Queen's Dab"; // local variable return `Driving ${boatName}`}function rideGermanBoat() { const status = rideBritishBoat(); return status;}rideGermanBoat();

El ejemplo anterior simula un escenario en el que los alemanes compraron un barco a Gran Bretaña….(Puedes cambiarlo por el país que quieras want…no necesito luchar por qué no mencioné a otro país. Estos son solo nombres de países y no bibliotecas JavaScript😛).
El rideGermanBoat() utiliza el rideBritishBoat().Dado que JavaScript utiliza el ámbito léxico, al ejecutar la función rideBritishBoat(), va al lugar donde se creó y obtiene la referencia de la variable: boatName. Por lo tanto, con el ámbito léxico, cada vez que se ejecuta rideBritishBoat(), JavaScript entra en el ámbito de la función para buscar las variables utilizadas en esta función.

Nota: El ámbito de la función rideBritishBoat() es su ámbito local y el ámbito global. El rideGermanBoat() no está en el ámbito léxico de la etiqueta rideBritishBoat() función, porque rideBritishBoat() no se ha creado dentro de él.

Ahora, cambiemos un poco el ejemplo:

function rideBritishBoat() { return `Driving ${boatName}`; // Reference Error: boatName not defined}function rideGermanBoat() { let boatName = "Merkel's Dab"; const status = rideBritishBoat(); return status;}rideGermanBoat();

El código anterior falla. Las funciones rideBritishBoat() no son precisas. Falla al intentar acceder a boatName en la instrucción return.

¿por Qué?

Esto se debe a que JavaScript utiliza el ámbito léxico.
Cómo funciona esto es cuando encuentra boatName variable dentro de la función rideBritishBoat(), busca dónde se creó la variable boatName en su cadena de alcance. Es decir, todo el alcance posible de esa función que es el: Ámbito local de la función, luego comprueba su ámbito de inclusión en este caso el Ámbito Global.

Así es como JavaScript comprueba las variables. Primero comprueba el bloque local en el que se usa la variable actual para saber si se declaró allí. Si no lo fue, entonces sube al ámbito de inclusión y continúa si no encuentra una declaración hasta que llega a la parte superior de la cadena, que es el ámbito global

Hay otro tipo de ámbito llamado «Ámbito dinámico».
El código anterior funcionaría en un lenguaje que admite el alcance dinámico (p. ej. Lisp).
Esto se debe a que en un entorno de ámbito dinámico, la variable se comprueba en tiempo de ejecución. Lo que significa es que cuando ejecuta rideGermanBoat() y la ejecución llega a rideBritishBoat() el entorno de tiempo de ejecución comprueba el valor de boatName donde el código se está ejecutando actualmente. En este caso, lo encuentra, por lo que no hay problema y el código funciona en lo esperado e imprime Driving Merkel's Dab.

El ámbito léxico también se llama Ámbito estático porque su ámbito se determina en tiempo de compilación. Lo que significa que su entorno/alcance es fijo y no puede cambiar. En otras palabras, las variables solo se pueden llamar desde el bloque de código en el que se declararon/crearon.

El ámbito dinámico se llama dinámico porque su entorno (ámbito externo) puede cambiar. En otras palabras, las variables se pueden llamar desde fuera del bloque en el que se crean.

Para que podamos tener otra función que use el rideBritishBoat() llamado rideMauritianBoat():

function rideMauritianBoat() { let boatName = "Flying Dodo's Dab"; const status = rideBritishBoat(); return status;}rideMauritianBoat();

En una dinámica ámbito de idioma, usted puede ver el valor de boatName variable dentro de rideBritishBoat() depende del ámbito en el que se ejecuta. Como podemos ver, este alcance puede cambiar, por lo tanto, es dinámico.
Por lo tanto, dentro de rideBritishBoat(), llama a la variable boatName de rideMauritianBoat() que está fuera de su alcance de bloque.

Eso es el Ámbito dinámico y el Ámbito Léxico es lo contrario.

Pero recuerde, JavaScript no tiene un ámbito dinámico. Esto es solo para mostrarte la diferencia.

Por lo tanto, el alcance léxico comprueba las variables en tiempo de compilación (las variables deben crearse y ser accesibles en el ámbito / bloque que se utiliza), mientras que el alcance dinámico comprueba las variables en tiempo de ejecución (es posible que las variables no se creen en el ámbito al compilar, pero pueden estar presentes cuando la función se está ejecutando).

Los Desarrolladores Sénior son como: ¡Amigo!! JavaScript no es un lenguaje compilado!!Por favor, dejemos esa charla para otro día. Trata de entender el mensaje que estoy pasando.Vale, estoy cabreado ahora mismo. Aquí tienes un ejercicio.

Ejercicio Rápido

¿Cuál sería la salida de esta función?

function rideBritishBoat() { let boatName = "Queen's Dab"; function rideWelshBoat() { boatName = "Welsh Royal Boat"; console.log(boatName) } rideWelshBoat();}rideBritishBoat()

Resumen

El objetivo de este artículo fue explicar el alcance léxico de una manera sencilla utilizando gramática básica y ejemplos cortos. Si notaste que algunas palabras están en negrita. Esas son las palabras clave para entender este concepto. Además, tengo muchas definiciones alternativas de los mismos conceptos. Esto se hizo para que usted pueda seleccionar cuál se hunde fácilmente para usted. Diferentes trazos para diferentes personas

De lo que hemos aprendido anteriormente, podemos decir que:

• Un ámbito es un entorno / región en el que existe algo (una variable)
• Un ámbito puede acceder a sus elementos primarios.
• Un ámbito padre no tiene acceso directo a las variables declaradas en un ámbito interno.
• El léxico tiene que ver con dónde se declaró / creó una variable.
• El ámbito léxico obliga a buscar variables del ámbito / bloque que se crearon / declararon y no del entorno en el que se ejecutan.
• El ámbito dinámico es lo opuesto al Ámbito léxico.
• El alcance dinámico comprueba las variables desde donde se ejecutan.

Gracias por leer.Nos vemos en el próximo post.