当前位置：首页 > news >正文

理解Js执行上下文

news 文章来源：https://blog.csdn.net/2301_76662406/article/details/142645026 2024/11/20 21:38:10

执行上下文

执行上下文（Context）又称上下文,在 JavaScript 中是一个重要的概念，它决定了变量和函数的可访问性及其行为。每个上下文都有一个关联的变量对象（Variable Object），所有在该上下文中定义的变量和函数都存储在这个对象上。虽然无法通过代码直接访问变量对象，但它在后台处理数据时是必不可少的。

全局上下文

全局上下文是最外层的上下文，表示全局作用域中的所有内容。在浏览器中，这个上下文由 window 对象表示。所有通过 var 定义的全局变量和函数都会成为 window 对象的属性和方法。使用 let 和 const 声明的顶级变量不会定义在全局上下文中，但在作用域链解析上效果是一样的。

全局上下文在其所有代码执行完毕后会被销毁，通常在应用程序退出时（例如关闭网页或退出浏览器）。

函数上下文

每个函数调用都有自己的上下文。当代码执行流进入函数时，函数的上下文被推入上下文栈。在函数执行完后，上下文栈将弹出该函数的上下文，控制权返回到之前的执行上下文。ECMAScript 程序的执行流正是通过这个上下文栈进行控制的。

一. 执行上下文的组成与功能

执行上下文是代码执行时的环境，包含以下信息：

变量对象：存储当前上下文中定义的所有变量和函数。
活动对象：函数上下文中的特定变量对象，包括参数和局部变量。
作用域链：用于查找变量的路径，确保在访问变量时遵循正确的顺序。

二. 变量对象与活动对象

1.变量对象

全局上下文的变量对象是全局对象（如 window）。
函数上下文的变量对象在函数被调用时创建，初始时仅包含一个特殊的 arguments 对象。

2.活动对象

活动对象（Activation Object）是一个抽象概念，用于表示在函数调用时其内部的变量和参数。虽然活动对象本身不是一个具体的对象，但它描述了函数执行时的环境和上下文。

活动对象是函数执行上下文中的变量对象的一个特定实例。当函数被调用时，会创建一个新的执行上下文，并且这个上下文中的变量对象被称为活动对象。活动对象除了包含arguments对象外，还会包含函数内部声明的所有局部变量、函数声明（注意，函数声明会提升，即它们会被添加到活动对象的顶部，即使它们在代码中的位置较低）和函数参数（如果参数名与arguments对象中的名称相同，则参数会覆盖arguments对象中的同名属性）。

(1). 活动对象的内容

在函数被调用时，活动对象会被创建，包含以下内容：

局部变量：在函数内部定义的变量。
参数：传递给函数的参数。
arguments 对象：包含所有传递给函数的参数的对象。
函数声明：在函数内部定义的其他函数。

(2).执行顺序

在函数调用时，活动对象的内容会按照以下顺序被处理：

参数处理：当函数被调用时，传入的参数会被添加到活动对象中。
局部变量声明：在函数内部定义的变量会被初始化并存储在活动对象中。
函数声明：如果在函数内部有其他函数声明，这些函数会被提升到活动对象的顶部。

3.理解活动对象的抽象概念

抽象性：活动对象是一个概念，用于描述函数执行时的环境，而不是一个具体的 JavaScript 对象。它帮助我们理解函数的作用域、变量生命周期和查找机制。
作用域管理：活动对象通过存储局部变量和参数，确保每次函数调用都有一个独立的作用域。这使得不同的函数调用不会相互干扰。

4. 理解活动对象的独立作用域

function outerFunction() {let outerVar = '我在外部！';function innerFunction(innerVar) {console.log(outerVar); // 访问外部函数的变量console.log(innerVar);  // 访问内部函数的参数}innerFunction('我在内部！');
}outerFunction();

(1.)独立作用域：

当调用 outerFunction 时，创建了一个新的活动对象，包含 outerVar。
当调用 innerFunction 时，另一个独立的活动对象被创建，包含 innerVar。

(2).变量查找：

innerFunction 中的 console.log(outerVar) 查找首先在 innerFunction 的活动对象中查找变量，如果未找到，则沿着作用域链向上查找，找到 outerFunction 的活动对象，因此可以访问 outerVar。
console.log(innerVar) 直接在 innerFunction 的活动对象中找到 innerVar。

输出结果为：

我在外部！
我在内部！

5.变量对象与活动对象的关系

在函数调用时，活动对象是变量对象的一部分，专门用于管理该函数的参数和局部变量。所有的局部变量都存储在活动对象中，这使得函数能够独立于其他上下文工作

变量对象是更广泛的概念,是包含当前上下文所有变量和函数的集合，而活动对象专注于函数调用时的特定变量管理。两者共同确保了 JavaScript 的作用域和变量生命周期的有效管理。

三. 作用域链:

作用域链是查找变量的机制，是一个从当前上下文到全局上下文的链条：

1.查找顺序

首先检查当前执行上下文的活动对象。
如果没有找到，继续查找上层上下文的活动对象，直到全局上下文。

2.关系

作用域链确保了变量的访问顺序，当前上下文的变量对象始终位于链的最前端(从当前上下文执行)。如果在当前上下文中找不到变量，JavaScript 会沿着作用域链向上查找，直到找到变量或到达全局上下文。

四.总结:

执行上下文、变量对象、活动对象和作用域链是密切相关的概念。每次代码执行时，都会创建一个新的执行上下文，并形成一条作用域链来管理变量的查找。这些机制共同作用，使 JavaScript 能够有效地处理作用域和变量的生命周期。

理解这些概念对于掌握 JavaScript 的行为和调试代码至关重要，特别是在处理异步操作和闭包时。