了解JavaScript中的执行上下文

目录

执行上下文

全局执行上下文

函数执行上下文

评估执行上下文

执行上下文与范围

结论

---

JavaScript最重要的概念之一是执行上下文。让我们定义全局、函数和eval执行上下文并查看一些示例。

现代应用程序通常由单段代码编写。在一个应用程序中，有各种各样的单段代码发挥着重要作用。函数通常根据输入和输出、变量保存数据等来做一些事情。

分段管理代码可以降低代码的复杂性并提高可扩展性。从长远来看，一大块代码是不可扩展的。在某些时候，它会引入复杂性并产生意想不到的错误。我们编写代码的方式可以极大地决定我们的应用程序是否成功。

现代应用程序通常大量使用JavaScript。如今，JavaScript无处不在——从构建漂亮的UI组件到可扩展的API和Web服务。

了解JavaScript的核心概念可以让开发人员达到一个全新的水平。JavaScript最重要的概念之一是执行上下文。它无处不在——每次你开始使用JavaScript创建东西时，无论你是否知道，你都会在后台使用它。每次新应用程序启动时，每次执行函数时，执行上下文都会在那里。那么，什么是执行上下文？

执行上下文

执行上下文允许JavaScript引擎管理解释和运行代码的复杂性。

执行上下文是一个抽象概念，它包含有关当前代码正在执行的环境的信息。

我们有三种不同类型的JavaScript执行上下文：

1. 全局执行上下文——这个执行上下文由JavaScript引擎默认创建。
2. 函数执行上下文——每当执行函数时都会创建此执行上下文。
3. eval执行上下文——这个执行上下文是在一个eval函数中创建的。

我们将使用由ui.dev创建的名为JavaScript Visualizer的工具。创建此工具是为了轻松可视化JavaScript中执行上下文、提升、闭包和作用域的工作方式。我们将使用这个工具来帮助我们理解JavaScript执行上下文以及它是如何工作的。

全局执行上下文

第一个执行上下文是在JavaScript引擎运行您的代码时创建的。JavaScript引擎在执行任何代码之前都会创建一个新的执行上下文，这个新的执行上下文称为全局执行上下文。

全局执行上下文是JavaScript引擎创建的默认执行上下文。所有不在函数或对象内的全局代码都将在全局执行上下文中执行。

转到我们的JavaScript Visualizer并单击“运行”按钮，无需编写任何代码。您可以看到我们的全局执行上下文是默认创建的。

每个执行上下文（不仅仅是全局上下文）都将包含两件事：

1. 全局对象——提供在当前环境中任何地方都可用的变量和函数。在浏览器中，全局对象被命名为window；使用Node.js时，全局对象名为global。
2. 这个对象——this关键字指向代码所属的当前执行上下文对象。

即使我们没有编写任何代码，JavaScript引擎仍然会创建一个全局执行上下文。JavaScript是一种单线程编程语言，因此JavaScript执行不可能有多个全局执行上下文。

在我们的JavaScript Visualizer中，我们将创建几行代码来查看函数执行上下文如何与全局执行上下文一起工作。

我们将创建两个包含两个值的变量和一个将两个数字相加的函数。

var number1 = 10;
var number2 = 10;


function sum(n1, n2) { 
  return n1 + n2;
}

有了这个，我们可以看到我们的全局执行上下文发生了变化。

最初，全局执行上下文有两个阶段：

1. 创建——在这个阶段，全局对象和this关键字被创建。为创建的变量和函数分配内存。你可以看到我们的变量持有“未定义”的值。
2. 执行 ——在这个阶段，代码的执行开始了。在我们的示例中，我们为变量赋值并定义了函数。

转到我们的JavaScript Visualizer，然后单击“运行”按钮。我们可以看到全局执行上下文将发生变化，并且我们的变量的值将在执行阶段被分配。

函数执行上下文

执行函数时会创建函数执行上下文。

我们将在示例中添加一行代码。我们将调用sum函数，看看会发生什么。

var number1 = 10;
var number2 = 10;

function sum(n1, n2) { 
  return n1 + n2;
}

sum(number1, number2);

再次转到我们的JavaScript Visualizer，然后单击“运行”按钮。我们可以看到我们的全局执行上下文再次发生了变化，并且创建了一个新的执行上下文。

创建的新执行上下文是函数执行上下文。它具有相同的阶段，我们可以访问一个称为arguments的特殊值。参数值是我们在执行函数时传递给函数的参数。

一个函数可以在其中执行一个函数，依此类推。每次执行函数时，都会创建一个新的函数执行上下文。

评估执行上下文

创建eval函数是为了将字符串转换为可执行的JavaScript代码。虽然看起来很强大，但不推荐使用这个功能，因为我们无法控制它的权限。

eval函数的使用可能会使您的应用程序或服务受到注入攻击。eval函数接收到的字符串可能是恶意字符串，可以完全破坏您的数据库或应用程序。这就是为什么不推荐使用eval函数的原因。

执行上下文与范围

开发人员习惯了很多编程术语，有时这可能会引起一些混乱。JavaScript开发人员可能会感到困惑并错误地描述了他们所指的术语。

执行上下文和范围不是一回事。

范围是基于功能的。作用域属于函数的变量访问。JavaScript中只有两个作用域——全局作用域和函数作用域。

执行上下文是基于对象的。执行上下文是一个抽象概念，它包含有关当前代码正在执行的环境的信息。函数的上下文是该函数的this关键字的值。

结论

JavaScript的核心概念可以彻底改变开发现代应用程序的游戏规则。执行上下文是了解JavaScript代码如何在后台运行的一个非常重要的概念。它存在于每个编写的JavaScript代码中，它是学习其他JavaScript概念（如提升、闭包、作用域等）的要求之一。

https://www.telerik.com/blogs/understanding-execution-context-javascript