Recientemente, estoy releiendo "JavaScript Advanced Programming 3" y siento que debería escribir algunos blogs para grabar algunos de los conocimientos que aprendí, de lo contrario lo olvidaré. Lo que quiero resumir hoy es el entorno de ejecución y el alcance de JS.
Primero, hablemos sobre el entorno de ejecución
1. Entorno de ejecución
El concepto en el libro, el entorno de ejecución define otros datos a los que las variables o funciones tienen acceso y determina sus comportamientos respectivos. Cada entorno de ejecución tiene un objeto variable asociado con él. Todas las variables y funciones definidas en el entorno se almacenan en este objeto. Aunque no podemos acceder a este objeto al escribir código, el analizador lo usará en segundo plano al procesar datos.
El entorno de ejecución es un concepto, un mecanismo que define si una variable o función tiene permiso para acceder a otros datos
En JavaScript, el código JavaScript ejecutable se divide en tres tipos:
1. Código global, es decir, código global que no está en ninguna función, como: un archivo js, código JS integrado en páginas HTML, etc.
2. Código de evaluación, es decir, código JS que se ejecuta dinámicamente usando la función eval ().
3. Código de funciones, es decir, el código JS del cuerpo de funciones en funciones definidas por el usuario.
Omita el código de evaluación y solo hable sobre el entorno de ejecución global y el entorno de ejecución de funciones.
1. Medio ambiente global:
El entorno global es el entorno de ejecución más periférico. El entorno de ejecución global se considera un objeto de ventana. Por lo tanto, todas las variables y funciones globales se crean como propiedades y métodos de objetos de ventana. Cuando el código se carga en el navegador, se crea el entorno de ejecución global (el entorno de ejecución global se destruye solo cuando cerramos la página web o el navegador). Por ejemplo, en una página, cree un entorno de ejecución global cuando el código JS se carga por primera vez.
Esta es también la razón por la cual los cierres tienen una desventaja de fuga de memoria. Porque las funciones externas en los cierres se tratan como un entorno global. Por lo tanto, no será destruido y se mantendrá en la memoria.
2. Entorno de ejecución de funciones
Cada función tiene su propio entorno de ejecución. Cuando la ejecución ingresa a una función, el entorno de ejecución de la función se empujará a la parte superior de una pila de entorno de ejecución y obtendrá los derechos de ejecución. Cuando se ejecuta esta función, su entorno de ejecución se elimina desde la parte superior de la pila y el derecho de ejecución se devuelve al entorno de ejecución anterior. Este es el flujo de ejecución en el programa ECMAScript.
También se puede interpretar de esta manera: cuando se llama a una función JavaScript, la función ingresará al entorno de ejecución correspondiente a la función. Si se llama a otra función, se crea un nuevo entorno de ejecución y el proceso de ejecución está en ese entorno durante la llamada de función. Cuando la función llamada devuelve, el proceso de ejecución regresa al entorno de ejecución original. Por lo tanto, la ejecución del código JavaScript forma una pila de entorno de ejecución.
Cuando se llama a una función, se crea el entorno local de la función (después de que se ejecuta el código en la función, el entorno se destruye y todas las variables y definiciones de función almacenadas en él también se destruyen).
Período de definición 2-1
Cuando se define una función, se creará un atributo [[alcance]]. Este objeto corresponde a una lista de objetos. JavaScript puede acceder internamente a los objetos en la lista y no se puede acceder a través de la sintaxis.
(El alcance significa alcance).
Definimos una función global A, y luego la función A crea un atributo A [[alcance]]. En este momento, [[alcance]] solo contiene el objeto global [objeto global].
Si definimos una función B dentro de A, la función B también creará un atributo [[alcance]]. El atributo de B [[alcance]] contiene dos objetos, uno es el objeto activo del objeto A activo objeto de activación del objeto y el otro es el objeto global. El objeto activo de A está al frente y el objeto global está en la parte posterior.
En resumen, el orden de la lista de objetos en la propiedad [alcance] de una función es el objeto de activación del objeto de la capa anterior de función, y luego la capa superior, hasta el objeto global más externo.
Aquí está el código de muestra: A tiene solo un alcance, B tiene dos ámbitos
// función externa a () {var someVar; // función interna de función b () {var someVar; }}2-2 Período de ejecución
Cuando se ejecuta una función, ingresa al entorno de ejecución de la función. Primero, crea su propio objeto activo [objeto de activación] (este objeto contiene la definición de esto, argumentos, variables locales (incluidos los parámetros con nombre) y una cadena de alcance de un objeto variable. Luego, copie el alcance del entorno de ejecución en [[cadena de alcance]] en orden, y finalmente presione el objeto activo a la cadena de acceso [[de alcance]. y objetos que tienen permiso para acceder al entorno de ejecución.
// El primer paso es crear el entorno de ejecución global. Contexto de ejecución global y objetos de actividad global. // Definir el global [[ACCEN]]], que solo contiene objetos de ventana // escanear las variables de definición global y los objetos de función: color 【indefinido】】, Changecolor 【FD crea Changecolor [[ACCANE]], que solo contiene objetos de actividad global], que se agregan a la ventana, por lo que las variables globales y los objetos de función global se definen como propiedades de la ventana. // El programa se ha definido para que Changecolor () se pueda ejecutar en cualquier lugar de este entorno de ejecución. The color has also been defined, but its value is undefined// The second step is color assigning "blue"var color = "blue";// It does not require assignment, it refers to its own function changecolor() { // The fourth step enters the execution environment of changecolor// Copy the changecolor [[scope]] to the scope chain // Create active objects, scan to define variables and define functions, Otro color 【indefinido】 y swapcolors 【fd crea los swapcolors [[alcance]] y agregan los objetos activos y los objetos activos globales】 a los objetos activos, y también agregan argumentos y esto // los objetos activos empujan a la cadena de alcance superior // El programa se ha definido para que los swapcolors () se puedan ejecutar en cualquier lugar de este entorno de ejecución. Otro Color se ha definido, pero su valor está indefinido // la quinta asignación de OTROS COLOR "RED" VAR OTROCOLOR = "RED"; // No requiere asignación, se refiere a su propia función SwapColors () {// Paso 7 Ingrese el entorno de ejecución de SwapColors y cree su objeto activo // Copiar swapcolors '[[alcance]] a la cadena de alcance // escane Valor de asignación de tempcolor de otro Color, otro Color y color se encontrarán a lo largo de la cadena de alcance, y continuará ejecutando var tempcolor = otherColor; otro Color = color; color = tempcolor; } // Paso 6: Ejecutar SwapColors e Ingrese su entorno de ejecución SwapColors ();} // Paso 3: Ejecute Changecolor e ingrese su entorno de ejecución Changecolor ();2-3 Identificador de acceso:
Cuando se encuentra un identificador durante la ejecución del código JS, buscará en la cadena de alcance del contexto de ejecución (contexto de ejecución) en función del nombre del identificador. A partir del primer objeto de la cadena de alcance (el objeto de activación del objeto de activación de la función), si no se encuentra, busque el siguiente objeto en la cadena de alcance y repita hasta que se encuentre la definición del identificador. Si el último objeto en el alcance no se encuentra después de buscar la búsqueda, es decir, el objeto global (objeto global), se lanzará un error, lo que provocará indefinido.
2. Cadena de alcance/alcance (cadena de alcance/alcance)
Cuando el código se ejecuta en un entorno, se crea una cadena de alcance. El propósito de la cadena de alcance es garantizar el acceso ordenado a todas las variables y funciones que tienen permiso para acceder al entorno de ejecución. Toda la cadena de alcance es una lista vinculada construida por objetos variables en diferentes ubicaciones de ejecución de acuerdo con las reglas. El extremo frontal de la cadena de alcance es siempre el objeto variable en el entorno donde se encuentra el código actualmente ejecutado.
Si este entorno es una función, su objeto de activación se usa como un objeto variable. El objeto activo solo contiene una variable al principio, que es el objeto de argumentos dentro de la función. El siguiente objeto variable en la cadena de alcance proviene del entorno de inclusión de la función, y el siguiente objeto variable proviene del siguiente entorno de inclusión. De esta manera, continúa al entorno de ejecución global, y el objeto variable del entorno de ejecución global es siempre el último objeto en la cadena de alcance.
Como se muestra en la figura:
Ejemplos en el libro:
var color = "azul"; function changeColor () {var otrocolor = "rojo"; function swapColors () {var tempcolor = otherColor; otro Color = color; color = tempcolor; // toDo something} swapColors ();} changeColor (); // no se puede acceder a Tempcolor y Anocolor aquí; pero se puede acceder a color; alerta ("el color ahora es"+color);A través del análisis anterior, podemos saber que el entorno interno puede acceder a todos los entornos externos a través de cadenas de alcance, pero el entorno externo no puede acceder a ninguna variabilidad y funciones en el entorno interno.
Estos entornos son lineales y ordenados. Cada entorno puede buscar cadenas de alcance hacia arriba para consultar variables y nombres de funciones; Sin embargo, cualquier entorno no puede ingresar a otro entorno de ejecución buscando cadenas de alcance hacia abajo.
Para la función SwapColor () en el ejemplo anterior, su cadena de alcance incluye: objeto variable SwapColor (), objeto variable Changecolor () y objeto global. El entorno local de SwapColor () comienza a buscar variables y nombres de funciones en su propio objeto variable. Si no se puede encontrar, busque la cadena de alcance de Changecolor hacia arriba. . . . . Etcétera. Sin embargo, la función Changecolor () no puede acceder a variables en SwapColor
Revelación: intente usar variables locales para reducir el tiempo de búsqueda
1. No hay alcance de nivel de bloque
A diferencia de C, C ++ y Java, JavaScript no tiene un alcance de nivel de bloque. Mira el siguiente código:
if (true) {var myvar = "zhang san"; } alerta (myvar); // zhang sanSi hay un alcance de nivel de bloque, no se puede acceder a Myvar desde el exterior. Mira lo siguiente
for (var i = 0; i <10; i ++) {console.log (i)} alert (i); // 10Para los idiomas con alcance de nivel de bloque, como el código Java o C#, es una variable inicializada y no se puede acceder afuera para. Debido a que solo existe en el peso de bucle for, después de ejecutar el bucle for, todas las variables en el for se destruyen. Este no es el caso en JavaScript. La declaración variable en For se agregará al entorno de ejecución actual (aquí está el entorno de ejecución global). Por lo tanto, después de completar el bucle for, la variable I todavía existe en el entorno de ejecución fuera del bucle. Por lo tanto, se emitirán 10.
2. Declarar variables
Cuando se declara una variable usando VAR, esta variable se agregará automáticamente al entorno disponible más cercano. Para el interior de una función, el entorno más cercano son las variables locales de la función. Si la variable no se inicializa, la variable se agrega automáticamente a la función global.
El código es el siguiente:
var name = "Xiao Ming"; function getName () {alert (nombre); // 'Undefined' var name = 'xiao huang'; alerta (nombre); // xiao huang} getName ()¿Por qué está indefinido el primer nombre? Esto se debe a que el analizador JavaScript ingresa a un entorno de ejecución de funciones y escanea VAR y función primero.
Es equivalente a promover la declaración VAR o función [Declaración de funciones] en la parte superior del entorno de ejecución.
En otras palabras, al ingresar nuestra función GetName, el mecanismo de búsqueda de identificadores encuentra el VAR, y el nombre es el nombre de la variable local, no el nombre global, porque el nombre en la función se promueve a la parte superior.
El código anterior se analizará de la siguiente manera:
var name = "Xiao Ming"; función getName () {nombre var; alerta (nombre); // 'Undefined' var name = 'xiao huang'; alerta (nombre); // xiao huang} getName ()Extender la cadena de alcance:
Aunque solo hay dos tipos de entornos de ejecución: alcance global y alcance funcional, la cadena de alcance aún se puede extender de alguna manera. Porque algunas declaraciones pueden agregar un objeto variable temporal a la parte superior de la cadena de alcance.
Hay dos situaciones en las que esto sucede:
1. El bloque de captura de la declaración Try-Catch;
2. Con declaración;
Lo anterior se trata de este artículo. Espero que sea útil para todos aprender y comprender el entorno y el alcance de la ejecución de JavaScript.